@teambit/component 0.0.649 → 0.0.653

package/{__preview-1644981953366.js → __preview-1645393132004.js}

@@ -1 +1 @@
-export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.649/dist/component.docs.mdx')]
+export const overview = [require('/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.653/dist/component.docs.mdx')]

package/dist/aspect-list.d.ts

@@ -43,6 +43,7 @@ export declare class AspectList {
         };
         icon: string;
     }[];
+    filter(ids?: string[]): AspectList;
     toLegacy(): ExtensionDataList;
     stringIds(): string[];
     static fromLegacyExtensions(legacyDataList: ExtensionDataList, scope?: string): AspectList;

package/dist/aspect-list.js

@@ -117,7 +117,7 @@ class AspectList {
     const res = {};
     this.entries.forEach(entry => {
       if (entry.config) {
-        res[entry.id.toString()] = entry.config;
+        res[entry.id.toString()] = (0, _extensionData().removeInternalConfigFields)(entry.config);
       }
     });
     return res;
@@ -128,6 +128,14 @@ class AspectList {
     return serializedEntries;
   }
 
+  filter(ids) {
+    if (!(ids !== null && ids !== void 0 && ids.length)) return new AspectList(this.entries);
+    const entries = this.entries.filter(aspectEntry => {
+      return ids === null || ids === void 0 ? void 0 : ids.includes(aspectEntry.id.toStringWithoutVersion());
+    });
+    return new AspectList(entries);
+  }
+
   toLegacy() {
     const legacyEntries = this.entries.map(entry => entry.legacy);
     return _extensionData().ExtensionDataList.fromArray(legacyEntries);

package/dist/aspect-list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["aspect-list.ts"],"names":["AspectList","constructor","entries","addEntry","aspectId","data","extensionDataEntry","ExtensionDataEntry","undefined","_legacy","entry","AspectEntry","push","withoutEntries","aspectIds","filter","includes","legacy","stringId","ids","list","map","id","toString","get","find","toStringWithoutVersion","ignoreVersion","aspectEntry","isEqual","predicate","pmap","entriesP","Promise","all","toConfigObject","res","forEach","config","serialize","serializedEntries","toLegacy","legacyEntries","ExtensionDataList","fromArray","stringIds","fromLegacyExtensions","legacyDataList","scope","newEntries","getAspectId","extensionId","name","ComponentID","fromString","fromLegacy","Error"],"mappings":";;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AACA;AACA;AACO,MAAMA,UAAN,CAAiB;AACtBC,EAAAA,WAAW,CAAUC,OAAV,EAAkC;AAAA,SAAxBA,OAAwB,GAAxBA,OAAwB;AAAE;;AAE/CC,EAAAA,QAAQ,CAACC,QAAD,EAAwBC,IAAqB,GAAG,EAAhD,EAAoD;AAC1D,UAAMC,kBAAkB,GAAG,KAAIC,mCAAJ,EAAuBC,SAAvB,EAAkCJ,QAAQ,CAACK,OAA3C,EAAoDD,SAApD,EAA+D,EAA/D,EAAmEH,IAAnE,CAA3B;AACA,UAAMK,KAAK,GAAG,KAAIC,0BAAJ,EAAgBP,QAAhB,EAA0BE,kBAA1B,CAAd;AACA,SAAKJ,OAAL,CAAaU,IAAb,CAAkBF,KAAlB;AACA,WAAOA,KAAP;AACD;AAED;AACF;AACA;;;AACEG,EAAAA,cAAc,CAACC,SAAD,EAAkC;AAC9C,UAAMZ,OAAO,GAAG,KAAKA,OAAL,CAAaa,MAAb,CAAqBL,KAAD,IAAW,CAACI,SAAS,CAACE,QAAV,CAAmBN,KAAK,CAACO,MAAN,CAAaC,QAAhC,CAAhC,CAAhB;AACA,WAAO,IAAIlB,UAAJ,CAAeE,OAAf,CAAP;AACD;AAED;AACF;AACA;;;AACS,MAAHiB,GAAG,GAAa;AAClB,UAAMC,IAAI,GAAG,KAAKlB,OAAL,CAAamB,GAAb,CAAkBX,KAAD,IAAWA,KAAK,CAACY,EAAN,CAASC,QAAT,EAA5B,CAAb;AACA,WAAOH,IAAP;AACD;AAED;AACF;AACA;;;AACEI,EAAAA,GAAG,CAACF,EAAD,EAAsC;AACvC,WAAO,KAAKpB,OAAL,CAAauB,IAAb,CAAmBf,KAAD,IAAW;AAClC,aAAOA,KAAK,CAACO,MAAN,CAAaC,QAAb,KAA0BI,EAA1B,IAAgCZ,KAAK,CAACY,EAAN,CAASI,sBAAT,OAAsCJ,EAA7E;AACD,KAFM,CAAP;AAGD;AAED;AACF;AACA;;;AACEG,EAAAA,IAAI,CAACH,EAAD,EAAkBK,aAAa,GAAG,KAAlC,EAAkE;AACpE,WAAO,KAAKzB,OAAL,CAAauB,IAAb,CAAmBG,WAAD,IAAiB;AACxC,aAAON,EAAE,CAACO,OAAH,CAAWD,WAAW,CAACN,EAAvB,EAA2B;AAAEK,QAAAA;AAAF,OAA3B,CAAP;AACD,KAFM,CAAP;AAGD;AAED;AACF;AACA;;;AACEN,EAAAA,GAAG,CAACS,SAAD,EAAiD;AAClD,UAAM5B,OAAO,GAAG,KAAKA,OAAL,CAAamB,GAAb,CAAiBS,SAAjB,CAAhB;AACA,WAAO,IAAI9B,UAAJ,CAAeE,OAAf,CAAP;AACD;AAED;AACF;AACA;;;AACY,QAAJ6B,IAAI,CAACD,SAAD,EAA0D;AAClE,UAAME,QAAQ,GAAG,KAAK9B,OAAL,CAAamB,GAAb,CAAiBS,SAAjB,CAAjB;AACA,UAAM5B,OAAO,GAAG,MAAM+B,OAAO,CAACC,GAAR,CAAYF,QAAZ,CAAtB;AACA,WAAO,IAAIhC,UAAJ,CAAeE,OAAf,CAAP;AACD;;AAEDiC,EAAAA,cAAc,GAAG;AACf,UAAMC,GAAG,GAAG,EAAZ;AACA,SAAKlC,OAAL,CAAamC,OAAb,CAAsB3B,KAAD,IAAW;AAC9B,UAAIA,KAAK,CAAC4B,MAAV,EAAkB;AAChBF,QAAAA,GAAG,CAAC1B,KAAK,CAACY,EAAN,CAASC,QAAT,EAAD,CAAH,GAA2Bb,KAAK,CAAC4B,MAAjC;AACD;AACF,KAJD;AAKA,WAAOF,GAAP;AACD;;AAEDG,EAAAA,SAAS,GAAG;AACV,UAAMC,iBAAiB,GAAG,KAAKtC,OAAL,CAAamB,GAAb,CAAkBX,KAAD,IAAWA,KAAK,CAAC6B,SAAN,EAA5B,CAA1B;AACA,WAAOC,iBAAP;AACD;;AAEDC,EAAAA,QAAQ,GAAsB;AAC5B,UAAMC,aAAa,GAAG,KAAKxC,OAAL,CAAamB,GAAb,CAAkBX,KAAD,IAAWA,KAAK,CAACO,MAAlC,CAAtB;AACA,WAAO0B,mCAAkBC,SAAlB,CAA4BF,aAA5B,CAAP;AACD;;AAEDG,EAAAA,SAAS,GAAa;AACpB,UAAM1B,GAAG,GAAG,KAAKjB,OAAL,CAAamB,GAAb,CAAkBX,KAAD,IAAWA,KAAK,CAACY,EAAN,CAASC,QAAT,EAA5B,CAAZ;AACA,WAAOJ,GAAP;AACD;;AAE0B,SAApB2B,oBAAoB,CAACC,cAAD,EAAoCC,KAApC,EAAgE;AACzF,UAAMC,UAAU,GAAGF,cAAc,CAAC1B,GAAf,CAAoBX,KAAD,IAAW;AAC/C,aAAO,KAAIC,0BAAJ,EAAgBuC,WAAW,CAACxC,KAAD,EAAQsC,KAAR,CAA3B,EAA2CtC,KAA3C,CAAP;AACD,KAFkB,CAAnB;AAIA,WAAO,IAAIV,UAAJ,CAAeiD,UAAf,CAAP;AACD;;AA5FqB;;;;AA+FxB,SAASC,WAAT,CAAqBxC,KAArB,EAAgDsC,KAAhD,EAAgE;AAC9D,MAAI,CAACtC,KAAK,CAACyC,WAAP,IAAsBzC,KAAK,CAAC0C,IAAhC,EAAsC,OAAOC,2BAAYC,UAAZ,CAAuB5C,KAAK,CAAC0C,IAA7B,CAAP;AACtC,MAAI1C,KAAK,CAACyC,WAAV,EAAuB,OAAOE,2BAAYE,UAAZ,CAAuB7C,KAAK,CAACyC,WAA7B,EAA0CH,KAA1C,CAAP;AACvB,QAAM,IAAIQ,KAAJ,CAAU,+CAAV,CAAN;AACD","sourcesContent":["import { ExtensionDataList, ExtensionDataEntry } from '@teambit/legacy/dist/consumer/config/extension-data';\nimport { ComponentID } from '@teambit/component-id';\nimport { AspectEntry, SerializableMap } from './aspect-entry';\n\n/**\n * list of aspects, each may have data and artifacts saved per component.\n */\nexport class AspectList {\n  constructor(readonly entries: AspectEntry[]) {}\n\n  addEntry(aspectId: ComponentID, data: SerializableMap = {}) {\n    const extensionDataEntry = new ExtensionDataEntry(undefined, aspectId._legacy, undefined, {}, data);\n    const entry = new AspectEntry(aspectId, extensionDataEntry);\n    this.entries.push(entry);\n    return entry;\n  }\n\n  /**\n   * transform an aspect list into a new one without the given aspect ids\n   */\n  withoutEntries(aspectIds: string[]): AspectList {\n    const entries = this.entries.filter((entry) => !aspectIds.includes(entry.legacy.stringId));\n    return new AspectList(entries);\n  }\n\n  /**\n   * get all ids as strings from the aspect list.\n   */\n  get ids(): string[] {\n    const list = this.entries.map((entry) => entry.id.toString());\n    return list;\n  }\n\n  /**\n   * get an aspect from the list using a serialized ID.\n   */\n  get(id: string): AspectEntry | undefined {\n    return this.entries.find((entry) => {\n      return entry.legacy.stringId === id || entry.id.toStringWithoutVersion() === id;\n    });\n  }\n\n  /**\n   * find aspect by component ID.\n   */\n  find(id: ComponentID, ignoreVersion = false): AspectEntry | undefined {\n    return this.entries.find((aspectEntry) => {\n      return id.isEqual(aspectEntry.id, { ignoreVersion });\n    });\n  }\n\n  /**\n   * transform an aspect list into a new one.\n   */\n  map(predicate: (entry: AspectEntry) => AspectEntry) {\n    const entries = this.entries.map(predicate);\n    return new AspectList(entries);\n  }\n\n  /**\n   * transform an aspect list into a new one.\n   */\n  async pmap(predicate: (entry: AspectEntry) => Promise<AspectEntry>) {\n    const entriesP = this.entries.map(predicate);\n    const entries = await Promise.all(entriesP);\n    return new AspectList(entries);\n  }\n\n  toConfigObject() {\n    const res = {};\n    this.entries.forEach((entry) => {\n      if (entry.config) {\n        res[entry.id.toString()] = entry.config;\n      }\n    });\n    return res;\n  }\n\n  serialize() {\n    const serializedEntries = this.entries.map((entry) => entry.serialize());\n    return serializedEntries;\n  }\n\n  toLegacy(): ExtensionDataList {\n    const legacyEntries = this.entries.map((entry) => entry.legacy);\n    return ExtensionDataList.fromArray(legacyEntries);\n  }\n\n  stringIds(): string[] {\n    const ids = this.entries.map((entry) => entry.id.toString());\n    return ids;\n  }\n\n  static fromLegacyExtensions(legacyDataList: ExtensionDataList, scope?: string): AspectList {\n    const newEntries = legacyDataList.map((entry) => {\n      return new AspectEntry(getAspectId(entry, scope), entry);\n    });\n\n    return new AspectList(newEntries);\n  }\n}\n\nfunction getAspectId(entry: ExtensionDataEntry, scope?: string) {\n  if (!entry.extensionId && entry.name) return ComponentID.fromString(entry.name);\n  if (entry.extensionId) return ComponentID.fromLegacy(entry.extensionId, scope);\n  throw new Error('aspect cannot be loaded without setting an ID');\n}\n"]}
+{"version":3,"sources":["aspect-list.ts"],"names":["AspectList","constructor","entries","addEntry","aspectId","data","extensionDataEntry","ExtensionDataEntry","undefined","_legacy","entry","AspectEntry","push","withoutEntries","aspectIds","filter","includes","legacy","stringId","ids","list","map","id","toString","get","find","toStringWithoutVersion","ignoreVersion","aspectEntry","isEqual","predicate","pmap","entriesP","Promise","all","toConfigObject","res","forEach","config","serialize","serializedEntries","length","toLegacy","legacyEntries","ExtensionDataList","fromArray","stringIds","fromLegacyExtensions","legacyDataList","scope","newEntries","getAspectId","extensionId","name","ComponentID","fromString","fromLegacy","Error"],"mappings":"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","sourcesContent":["import {\n  ExtensionDataList,\n  ExtensionDataEntry,\n  removeInternalConfigFields,\n} from '@teambit/legacy/dist/consumer/config/extension-data';\nimport { ComponentID } from '@teambit/component-id';\nimport { AspectEntry, SerializableMap } from './aspect-entry';\n\n/**\n * list of aspects, each may have data and artifacts saved per component.\n */\nexport class AspectList {\n  constructor(readonly entries: AspectEntry[]) {}\n\n  addEntry(aspectId: ComponentID, data: SerializableMap = {}) {\n    const extensionDataEntry = new ExtensionDataEntry(undefined, aspectId._legacy, undefined, {}, data);\n    const entry = new AspectEntry(aspectId, extensionDataEntry);\n    this.entries.push(entry);\n    return entry;\n  }\n\n  /**\n   * transform an aspect list into a new one without the given aspect ids\n   */\n  withoutEntries(aspectIds: string[]): AspectList {\n    const entries = this.entries.filter((entry) => !aspectIds.includes(entry.legacy.stringId));\n    return new AspectList(entries);\n  }\n\n  /**\n   * get all ids as strings from the aspect list.\n   */\n  get ids(): string[] {\n    const list = this.entries.map((entry) => entry.id.toString());\n    return list;\n  }\n\n  /**\n   * get an aspect from the list using a serialized ID.\n   */\n  get(id: string): AspectEntry | undefined {\n    return this.entries.find((entry) => {\n      return entry.legacy.stringId === id || entry.id.toStringWithoutVersion() === id;\n    });\n  }\n\n  /**\n   * find aspect by component ID.\n   */\n  find(id: ComponentID, ignoreVersion = false): AspectEntry | undefined {\n    return this.entries.find((aspectEntry) => {\n      return id.isEqual(aspectEntry.id, { ignoreVersion });\n    });\n  }\n\n  /**\n   * transform an aspect list into a new one.\n   */\n  map(predicate: (entry: AspectEntry) => AspectEntry) {\n    const entries = this.entries.map(predicate);\n    return new AspectList(entries);\n  }\n\n  /**\n   * transform an aspect list into a new one.\n   */\n  async pmap(predicate: (entry: AspectEntry) => Promise<AspectEntry>) {\n    const entriesP = this.entries.map(predicate);\n    const entries = await Promise.all(entriesP);\n    return new AspectList(entries);\n  }\n\n  toConfigObject() {\n    const res = {};\n    this.entries.forEach((entry) => {\n      if (entry.config) {\n        res[entry.id.toString()] = removeInternalConfigFields(entry.config);\n      }\n    });\n    return res;\n  }\n\n  serialize() {\n    const serializedEntries = this.entries.map((entry) => entry.serialize());\n    return serializedEntries;\n  }\n\n  filter(ids?: string[]): AspectList {\n    if (!ids?.length) return new AspectList(this.entries);\n    const entries = this.entries.filter((aspectEntry) => {\n      return ids?.includes(aspectEntry.id.toStringWithoutVersion());\n    });\n    return new AspectList(entries);\n  }\n\n  toLegacy(): ExtensionDataList {\n    const legacyEntries = this.entries.map((entry) => entry.legacy);\n    return ExtensionDataList.fromArray(legacyEntries);\n  }\n\n  stringIds(): string[] {\n    const ids = this.entries.map((entry) => entry.id.toString());\n    return ids;\n  }\n\n  static fromLegacyExtensions(legacyDataList: ExtensionDataList, scope?: string): AspectList {\n    const newEntries = legacyDataList.map((entry) => {\n      return new AspectEntry(getAspectId(entry, scope), entry);\n    });\n\n    return new AspectList(newEntries);\n  }\n}\n\nfunction getAspectId(entry: ExtensionDataEntry, scope?: string) {\n  if (!entry.extensionId && entry.name) return ComponentID.fromString(entry.name);\n  if (entry.extensionId) return ComponentID.fromLegacy(entry.extensionId, scope);\n  throw new Error('aspect cannot be loaded without setting an ID');\n}\n"]}

package/dist/component-factory.d.ts

@@ -55,7 +55,7 @@ export interface ComponentFactory {
      * load aspects.
      * returns the loaded aspect ids including the loaded versions.
      */
-    loadAspects: (ids: string[], throwOnError: boolean) => Promise<string[]>;
+    loadAspects: (ids: string[], throwOnError?: boolean, neededFor?: ComponentID) => Promise<string[]>;
     /**
      * Resolve dirs for aspects
      */

package/dist/component.graphql.d.ts

@@ -16,7 +16,9 @@ export declare function componentSchema(componentExtension: ComponentMain): {
             headTag: (component: Component) => import(".").TagProps | undefined;
             latest: (component: Component) => string | undefined;
             tags: (component: any) => any;
-            aspects: (component: Component) => {
+            aspects: (component: Component, { include }: {
+                include?: string[] | undefined;
+            }) => {
                 id: string;
                 config: {
                     [key: string]: any;

package/dist/component.graphql.js

@@ -135,7 +135,7 @@ function componentSchema(componentExtension) {
         # list of component releases.
         tags: [Tag]!
 
-        aspects: [Aspect]
+        aspects(include: [String]): [Aspect]
       }
 
       type Aspect {
@@ -200,9 +200,10 @@ function componentSchema(componentExtension) {
           // graphql doesn't support map types
           return component.tags.toArray().map(tag => tag.toObject());
         },
-        aspects: component => {
-          const aspects = component.state.aspects.serialize();
-          return aspects;
+        aspects: (component, {
+          include
+        }) => {
+          return component.state.aspects.filter(include).serialize();
         }
       },
       ComponentHost: {

package/dist/component.graphql.js.map

@@ -1 +1 @@
-{"version":3,"sources":["component.graphql.ts"],"names":["componentSchema","componentExtension","typeDefs","resolvers","JSONObject","GraphQLJSONObject","Component","id","component","toObject","displayName","fs","state","filesystem","files","map","file","relative","getFile","path","maybeFile","find","undefined","contents","toString","mainFile","_consumer","headTag","latest","tags","toArray","tag","aspects","serialize","ComponentHost","get","host","componentId","resolveComponentId","error","snaps","getLogs","list","filter","listInvalid","invalidComps","err","errorName","name","errorMessage","message","Query","getHost","componentExt"],"mappings":";;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAMO,SAASA,eAAT,CAAyBC,kBAAzB,EAA4D;AACjE,SAAO;AACLC,IAAAA,QAAQ,EAAE,0BAAI;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAzHS;AA0HLC,IAAAA,SAAS,EAAE;AACTC,MAAAA,UAAU,EAAEC,oCADH;AAETC,MAAAA,SAAS,EAAE;AACTC,QAAAA,EAAE,EAAGC,SAAD,IAA0BA,SAAS,CAACD,EAAV,CAAaE,QAAb,EADrB;AAETC,QAAAA,WAAW,EAAGF,SAAD,IAA0BA,SAAS,CAACE,WAFxC;AAGTC,QAAAA,EAAE,EAAGH,SAAD,IAA0B;AAC5B,iBAAOA,SAAS,CAACI,KAAV,CAAgBC,UAAhB,CAA2BC,KAA3B,CAAiCC,GAAjC,CAAsCC,IAAD,IAAUA,IAAI,CAACC,QAApD,CAAP;AACD,SALQ;AAMTC,QAA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","sourcesContent":["import stripAnsi from 'strip-ansi';\nimport gql from 'graphql-tag';\nimport { GraphQLJSONObject } from 'graphql-type-json';\nimport { pathNormalizeToLinux } from '@teambit/legacy/dist/utils';\n\nimport { Component } from './component';\nimport { ComponentFactory } from './component-factory';\nimport { ComponentMain } from './component.main.runtime';\n\nexport function componentSchema(componentExtension: ComponentMain) {\n  return {\n    typeDefs: gql`\n      scalar JSON\n      scalar JSONObject\n\n      type ComponentID {\n        name: String!\n        version: String\n        scope: String\n      }\n\n      type Tag {\n        # semver assigned to the tag.\n        version: String!\n\n        # tag hash.\n        hash: String!\n      }\n\n      type Snap {\n        # hash of the snapshot.\n        hash: String!\n\n        # time of the snapshot.\n        timestamp: String!\n\n        # parents of the snap\n        parents: [Snap]!\n\n        # snapper\n        author: Author!\n\n        # snapshot message\n        message: String\n      }\n\n      type LogEntry {\n        message: String!\n        username: String\n        email: String\n        date: String\n        hash: String!\n        tag: String\n        # id: String!\n      }\n\n      type Author {\n        # display name of the snapper.\n        displayName: String!\n\n        # author of the snapper.\n        email: String!\n      }\n\n      type Component {\n        # id of the component.\n        id: ComponentID!\n\n        # head snap of the component.\n        head: Snap\n\n        # head tag of the component.\n        headTag: Tag\n\n        # list of all relative component paths.\n        fs: [String]\n\n        # relative path to the main file of the component\n        mainFile: String\n\n        # return specific file contents by relative file path.\n        getFile(path: String): String\n\n        # latest version of the component.\n        latest: String\n\n        # display name of the component\n        displayName: String!\n\n        # component buildStatus\n        buildStatus: String\n\n        # list of component releases.\n        tags: [Tag]!\n\n        aspects: [Aspect]\n      }\n\n      type Aspect {\n        id: String!\n        icon: String\n        config: JSONObject\n        data: JSONObject\n      }\n\n      type InvalidComponent {\n        id: ComponentID!\n        errorName: String!\n        errorMessage: String!\n      }\n\n      type ComponentHost {\n        id: ID!\n        name: String!\n\n        # load a component.\n        get(id: String!, withState: Boolean): Component\n\n        # list components\n        list(offset: Int, limit: Int): [Component]!\n\n        # list invalid components and their errors\n        listInvalid: [InvalidComponent]!\n\n        # get component logs(snaps) by component id\n        snaps(id: String!): [LogEntry]!\n      }\n\n      type Query {\n        getHost(id: String): ComponentHost\n      }\n    `,\n    resolvers: {\n      JSONObject: GraphQLJSONObject,\n      Component: {\n        id: (component: Component) => component.id.toObject(),\n        displayName: (component: Component) => component.displayName,\n        fs: (component: Component) => {\n          return component.state.filesystem.files.map((file) => file.relative);\n        },\n        getFile: (component: Component, { path }: { path: string }) => {\n          const maybeFile = component.state.filesystem.files.find(\n            (file) => pathNormalizeToLinux(file.relative) === path\n          );\n          if (!maybeFile) return undefined;\n          return maybeFile.contents.toString('utf-8');\n        },\n        mainFile: (component: Component) => {\n          return component.state._consumer.mainFile;\n        },\n        headTag: (component: Component) => component.headTag?.toObject(),\n        latest: (component: Component) => component.latest,\n        tags: (component) => {\n          // graphql doesn't support map types\n          return component.tags.toArray().map((tag) => tag.toObject());\n        },\n        aspects: (component: Component) => {\n          const aspects = component.state.aspects.serialize();\n          return aspects;\n        },\n      },\n      ComponentHost: {\n        get: async (host: ComponentFactory, { id }: { id: string }) => {\n          try {\n            const componentId = await host.resolveComponentId(id);\n            const component = await host.get(componentId);\n            return component;\n          } catch (error: any) {\n            return null;\n          }\n        },\n        snaps: async (host: ComponentFactory, { id }: { id: string }) => {\n          const componentId = await host.resolveComponentId(id);\n          // return (await host.getLogs(componentId)).map(log => ({...log, id: log.hash}))\n          return host.getLogs(componentId);\n        },\n        list: async (host: ComponentFactory, filter?: { offset: number; limit: number }) => {\n          return host.list(filter);\n        },\n        listInvalid: async (host: ComponentFactory) => {\n          const invalidComps = await host.listInvalid();\n          return invalidComps.map(({ id, err }) => ({\n            id,\n            errorName: err.name,\n            errorMessage: err.message ? stripAnsi(err.message) : err.name,\n          }));\n        },\n        id: async (host: ComponentFactory) => {\n          return host.name;\n        },\n        name: async (host: ComponentFactory) => {\n          return host.name;\n        },\n      },\n      Query: {\n        getHost: (componentExt: ComponentMain, { id }: { id: string }) => {\n          return componentExtension.getHost(id);\n        },\n      },\n    },\n  };\n}\n"]}
+{"version":3,"sources":["component.graphql.ts"],"names":["componentSchema","componentExtension","typeDefs","resolvers","JSONObject","GraphQLJSONObject","Component","id","component","toObject","displayName","fs","state","filesystem","files","map","file","relative","getFile","path","maybeFile","find","undefined","contents","toString","mainFile","_consumer","headTag","latest","tags","toArray","tag","aspects","include","filter","serialize","ComponentHost","get","host","componentId","resolveComponentId","error","snaps","getLogs","list","listInvalid","invalidComps","err","errorName","name","errorMessage","message","Query","getHost","componentExt"],"mappings":";;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAMO,SAASA,eAAT,CAAyBC,kBAAzB,EAA4D;AACjE,SAAO;AACLC,IAAAA,QAAQ,EAAE,0BAAI;AAClB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAzHS;AA0HLC,IAAAA,SAAS,EAAE;AACTC,MAAAA,UAAU,EAAEC,oCADH;AAETC,MAAAA,SAAS,EAAE;AACTC,QAAAA,EAAE,EAAGC,SAAD,IAA0BA,SAAS,CAACD,EAAV,CAAaE,QAAb,EADrB;AAETC,QAAAA,WAAW,EAAGF,SAAD,IAA0BA,SAAS,CAACE,WAFxC;AAGTC,QAAAA,EAAE,EAAGH,SAAD,IAA0B;AAC5B,iBAAOA,SAAS,CAACI,KAAV,CAAgBC,UAAhB,CAA2BC,KAA3B,CAAiCC,GAAjC,CAAsCC,IAAD,IAAUA,IAAI,CAACC,QAApD,CAAP;AACD,SALQ;AAMTC,QAA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","sourcesContent":["import stripAnsi from 'strip-ansi';\nimport gql from 'graphql-tag';\nimport { GraphQLJSONObject } from 'graphql-type-json';\nimport { pathNormalizeToLinux } from '@teambit/legacy/dist/utils';\n\nimport { Component } from './component';\nimport { ComponentFactory } from './component-factory';\nimport { ComponentMain } from './component.main.runtime';\n\nexport function componentSchema(componentExtension: ComponentMain) {\n  return {\n    typeDefs: gql`\n      scalar JSON\n      scalar JSONObject\n\n      type ComponentID {\n        name: String!\n        version: String\n        scope: String\n      }\n\n      type Tag {\n        # semver assigned to the tag.\n        version: String!\n\n        # tag hash.\n        hash: String!\n      }\n\n      type Snap {\n        # hash of the snapshot.\n        hash: String!\n\n        # time of the snapshot.\n        timestamp: String!\n\n        # parents of the snap\n        parents: [Snap]!\n\n        # snapper\n        author: Author!\n\n        # snapshot message\n        message: String\n      }\n\n      type LogEntry {\n        message: String!\n        username: String\n        email: String\n        date: String\n        hash: String!\n        tag: String\n        # id: String!\n      }\n\n      type Author {\n        # display name of the snapper.\n        displayName: String!\n\n        # author of the snapper.\n        email: String!\n      }\n\n      type Component {\n        # id of the component.\n        id: ComponentID!\n\n        # head snap of the component.\n        head: Snap\n\n        # head tag of the component.\n        headTag: Tag\n\n        # list of all relative component paths.\n        fs: [String]\n\n        # relative path to the main file of the component\n        mainFile: String\n\n        # return specific file contents by relative file path.\n        getFile(path: String): String\n\n        # latest version of the component.\n        latest: String\n\n        # display name of the component\n        displayName: String!\n\n        # component buildStatus\n        buildStatus: String\n\n        # list of component releases.\n        tags: [Tag]!\n\n        aspects(include: [String]): [Aspect]\n      }\n\n      type Aspect {\n        id: String!\n        icon: String\n        config: JSONObject\n        data: JSONObject\n      }\n\n      type InvalidComponent {\n        id: ComponentID!\n        errorName: String!\n        errorMessage: String!\n      }\n\n      type ComponentHost {\n        id: ID!\n        name: String!\n\n        # load a component.\n        get(id: String!, withState: Boolean): Component\n\n        # list components\n        list(offset: Int, limit: Int): [Component]!\n\n        # list invalid components and their errors\n        listInvalid: [InvalidComponent]!\n\n        # get component logs(snaps) by component id\n        snaps(id: String!): [LogEntry]!\n      }\n\n      type Query {\n        getHost(id: String): ComponentHost\n      }\n    `,\n    resolvers: {\n      JSONObject: GraphQLJSONObject,\n      Component: {\n        id: (component: Component) => component.id.toObject(),\n        displayName: (component: Component) => component.displayName,\n        fs: (component: Component) => {\n          return component.state.filesystem.files.map((file) => file.relative);\n        },\n        getFile: (component: Component, { path }: { path: string }) => {\n          const maybeFile = component.state.filesystem.files.find(\n            (file) => pathNormalizeToLinux(file.relative) === path\n          );\n          if (!maybeFile) return undefined;\n          return maybeFile.contents.toString('utf-8');\n        },\n        mainFile: (component: Component) => {\n          return component.state._consumer.mainFile;\n        },\n        headTag: (component: Component) => component.headTag?.toObject(),\n        latest: (component: Component) => component.latest,\n        tags: (component) => {\n          // graphql doesn't support map types\n          return component.tags.toArray().map((tag) => tag.toObject());\n        },\n        aspects: (component: Component, { include }: { include?: string[] }) => {\n          return component.state.aspects.filter(include).serialize();\n        },\n      },\n      ComponentHost: {\n        get: async (host: ComponentFactory, { id }: { id: string }) => {\n          try {\n            const componentId = await host.resolveComponentId(id);\n            const component = await host.get(componentId);\n            return component;\n          } catch (error: any) {\n            return null;\n          }\n        },\n        snaps: async (host: ComponentFactory, { id }: { id: string }) => {\n          const componentId = await host.resolveComponentId(id);\n          // return (await host.getLogs(componentId)).map(log => ({...log, id: log.hash}))\n          return host.getLogs(componentId);\n        },\n        list: async (host: ComponentFactory, filter?: { offset: number; limit: number }) => {\n          return host.list(filter);\n        },\n        listInvalid: async (host: ComponentFactory) => {\n          const invalidComps = await host.listInvalid();\n          return invalidComps.map(({ id, err }) => ({\n            id,\n            errorName: err.name,\n            errorMessage: err.message ? stripAnsi(err.message) : err.name,\n          }));\n        },\n        id: async (host: ComponentFactory) => {\n          return host.name;\n        },\n        name: async (host: ComponentFactory) => {\n          return host.name;\n        },\n      },\n      Query: {\n        getHost: (componentExt: ComponentMain, { id }: { id: string }) => {\n          return componentExtension.getHost(id);\n        },\n      },\n    },\n  };\n}\n"]}

package/dist/ui/use-component-query.d.ts

@@ -1,7 +1,9 @@
+import { ComponentDescriptor } from '@teambit/component-descriptor';
 import { ComponentModel } from './component-model';
 import { ComponentError } from './component-error';
 /** provides data to component ui page, making sure both variables and return value are safely typed and memoized */
 export declare function useComponentQuery(componentId: string, host: string): {
+    componentDescriptor: ComponentDescriptor | undefined;
     component: ComponentModel | undefined;
     error: ComponentError | undefined;
 };

package/dist/ui/use-component-query.js

@@ -57,6 +57,16 @@ function _componentId() {
   return data;
 }
 
+function _componentDescriptor() {
+  const data = require("@teambit/component-descriptor");
+
+  _componentDescriptor = function () {
+    return data;
+  };
+
+  return data;
+}
+
 function _componentModel() {
   const data = require("./component-model");
 
@@ -93,6 +103,10 @@ const componentFields = (0, _client().gql)`
     id {
       ...componentIdFields
     }
+    aspects(include: ["teambit.preview/preview"]) {
+      id
+      data
+    }
     packageName
     elementsUrl
     description
@@ -115,6 +129,7 @@ const componentFields = (0, _client().gql)`
       id
       icon
     }
+
     preview {
       includesEnvTemplate
     }
@@ -264,7 +279,22 @@ function useComponentQuery(componentId, host) {
   }, []);
   const rawComponent = data === null || data === void 0 ? void 0 : (_data$getHost = data.getHost) === null || _data$getHost === void 0 ? void 0 : _data$getHost.get;
   return (0, _react().useMemo)(() => {
+    var _rawComponent$aspects;
+
+    const aspectList = {
+      entries: rawComponent === null || rawComponent === void 0 ? void 0 : (_rawComponent$aspects = rawComponent.aspects) === null || _rawComponent$aspects === void 0 ? void 0 : _rawComponent$aspects.map(aspect => ({
+        aspectId: aspect.id,
+        aspectData: aspect.data
+      }))
+    };
+
+    const id = rawComponent && _componentId().ComponentID.fromObject(rawComponent.id);
+
     return {
+      componentDescriptor: id ? _componentDescriptor().ComponentDescriptor.fromObject({
+        id: id.toString(),
+        aspectList
+      }) : undefined,
       component: rawComponent ? _componentModel().ComponentModel.from(_objectSpread(_objectSpread({}, rawComponent), {}, {
         host
       })) : undefined,

package/dist/ui/use-component-query.js.map

@@ -1 +1 @@
-{"version":3,"sources":["use-component-query.ts"],"names":["componentIdFields","componentFields","GET_COMPONENT","SUB_SUBSCRIPTION_ADDED","SUB_COMPONENT_CHANGED","SUB_COMPONENT_REMOVED","useComponentQuery","componentId","host","idRef","current","data","error","loading","subscribeToMore","variables","id","extensionId","unsubAddition","document","updateQuery","prev","subscriptionData","prevComponent","getHost","get","addedComponent","componentAdded","component","name","unsubChanges","updatedComponent","componentChanged","isUpdated","ComponentID","isEqualObj","unsubRemoval","removedIds","componentRemoved","componentIds","length","isRemoved","some","removedId","rawComponent","ComponentModel","from","undefined","ComponentError","message"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;;;;;AAEA,MAAMA,iBAAiB,GAAG,kBAAI;AAC9B;AACA;AACA;AACA;AACA;AACA,CANA;AAQA,MAAMC,eAAe,GAAG,kBAAI;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAID,iBAAkB;AACtB,CAhCA;AAkCA,MAAME,aAAa,GAAG,kBAAI;AAC1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAID,eAAgB;AACpB,CAVA;AAYA,MAAME,sBAAsB,GAAG,kBAAI;AACnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIF,eAAgB;AACpB,CATA;AAWA,MAAMG,qBAAqB,GAAG,kBAAI;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIH,eAAgB;AACpB,CATA;AAWA,MAAMI,qBAAqB,GAAG,kBAAI;AAClC;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIL,iBAAkB;AACtB,CATA;AAWA;;AACO,SAASM,iBAAT,CAA2BC,WAA3B,EAAgDC,IAAhD,EAA8D;AAAA;;AACnE,QAAMC,KAAK,GAAG,qBAAOF,WAAP,CAAd;AACAE,EAAAA,KAAK,CAACC,OAAN,GAAgBH,WAAhB;AACA,QAAM;AAAEI,IAAAA,IAAF;AAAQC,IAAAA,KAAR;AAAeC,IAAAA,OAAf;AAAwBC,IAAAA;AAAxB,MAA4C,yCAAaZ,aAAb,EAA4B;AAC5Ea,IAAAA,SAAS,EAAE;AAAEC,MAAAA,EAAE,EAAET,WAAN;AAAmBU,MAAAA,WAAW,EAAET;AAAhC;AADiE,GAA5B,CAAlD;AAIA,0BAAU,MAAM;AACd;AACA,QAAIA,IAAI,KAAK,6BAAb,EAA4C;AAC1C,aAAO,MAAM,CAAE,CAAf;AACD;;AAED,UAAMU,aAAa,GAAGJ,eAAe,CAAC;AACpCK,MAAAA,QAAQ,EAAEhB,sBAD0B;AAEpCiB,MAAAA,WAAW,EAAE,CAACC,IAAD,EAAO;AAAEC,QAAAA;AAAF,OAAP,KAAgC;AAAA;;AAC3C,cAAMC,aAAa,GAAGF,IAAH,aAAGA,IAAH,wCAAGA,IAAI,CAAEG,OAAT,kDAAG,cAAeC,GAArC;AACA,cAAMC,cAAc,GAAGJ,gBAAH,aAAGA,gBAAH,gDAAGA,gBAAgB,CAAEX,IAArB,oFAAG,sBAAwBgB,cAA3B,2DAAG,uBAAwCC,SAA/D;AAEA,YAAI,CAACF,cAAD,IAAmBH,aAAvB,EAAsC,OAAOF,IAAP;;AAEtC,YAAIZ,KAAK,CAACC,OAAN,KAAkBgB,cAAc,CAACV,EAAf,CAAkBa,IAAxC,EAA8C;AAC5C,iDACKR,IADL;AAEEG,YAAAA,OAAO,kCACFH,IAAI,CAACG,OADH;AAELC,cAAAA,GAAG,EAAEC;AAFA;AAFT;AAOD;;AAED,eAAOL,IAAP;AACD;AAnBmC,KAAD,CAArC;AAsBA,UAAMS,YAAY,GAAGhB,eAAe,CAAC;AACnCK,MAAAA,QAAQ,EAAEf,qBADyB;AAEnCgB,MAAAA,WAAW,EAAE,CAACC,IAAD,EAAO;AAAEC,QAAAA;AAAF,OAAP,KAAgC;AAAA;;AAC3C,YAAI,CAACA,gBAAgB,CAACX,IAAtB,EAA4B,OAAOU,IAAP;AAE5B,cAAME,aAAa,GAAGF,IAAH,aAAGA,IAAH,yCAAGA,IAAI,CAAEG,OAAT,mDAAG,eAAeC,GAArC;AACA,cAAMM,gBAAgB,GAAGT,gBAAH,aAAGA,gBAAH,iDAAGA,gBAAgB,CAAEX,IAArB,qFAAG,uBAAwBqB,gBAA3B,2DAAG,uBAA0CJ,SAAnE;;AAEA,cAAMK,SAAS,GAAGF,gBAAgB,IAAIG,2BAAYC,UAAZ,CAAuBZ,aAAvB,aAAuBA,aAAvB,uBAAuBA,aAAa,CAAEP,EAAtC,EAA0Ce,gBAA1C,aAA0CA,gBAA1C,uBAA0CA,gBAAgB,CAAEf,EAA5D,CAAtC;;AAEA,YAAIiB,SAAJ,EAAe;AACb,iDACKZ,IADL;AAEEG,YAAAA,OAAO,kCACFH,IAAI,CAACG,OADH;AAELC,cAAAA,GAAG,EAAEM;AAFA;AAFT;AAOD;;AAED,eAAOV,IAAP;AACD;AArBkC,KAAD,CAApC;AAwBA,UAAMe,YAAY,GAAGtB,eAAe,CAAC;AACnCK,MAAAA,QAAQ,EAAEd,qBADyB;AAEnCe,MAAAA,WAAW,EAAE,CAACC,IAAD,EAAO;AAAEC,QAAAA;AAAF,OAAP,KAAgC;AAAA;;AAC3C,YAAI,CAACA,gBAAgB,CAACX,IAAtB,EAA4B,OAAOU,IAAP;AAE5B,cAAME,aAAa,GAAGF,IAAH,aAAGA,IAAH,yCAAGA,IAAI,CAAEG,OAAT,mDAAG,eAAeC,GAArC;AACA,cAAMY,UAAwC,GAAGf,gBAAH,aAAGA,gBAAH,iDAAGA,gBAAgB,CAAEX,IAArB,qFAAG,uBAAwB2B,gBAA3B,2DAAG,uBAA0CC,YAA3F;AACA,YAAI,CAAChB,aAAD,IAAkB,EAACc,UAAD,aAACA,UAAD,eAACA,UAAU,CAAEG,MAAb,CAAtB,EAA2C,OAAOnB,IAAP;AAE3C,cAAMoB,SAAS,GAAGJ,UAAU,CAACK,IAAX,CAAiBC,SAAD,IAAeT,2BAAYC,UAAZ,CAAuBQ,SAAvB,EAAkCpB,aAAa,CAACP,EAAhD,CAA/B,CAAlB;;AAEA,YAAIyB,SAAJ,EAAe;AACb,iDACKpB,IADL;AAEEG,YAAAA,OAAO,kCACFH,IAAI,CAACG,OADH;AAELC,cAAAA,GAAG,EAAE;AAFA;AAFT;AAOD;;AAED,eAAOJ,IAAP;AACD;AAtBkC,KAAD,CAApC;AAyBA,WAAO,MAAM;AACXS,MAAAA,YAAY;AACZZ,MAAAA,aAAa;AACbkB,MAAAA,YAAY;AACb,KAJD;AAKD,GAlFD,EAkFG,EAlFH;AAoFA,QAAMQ,YAAY,GAAGjC,IAAH,aAAGA,IAAH,wCAAGA,IAAI,CAAEa,OAAT,kDAAG,cAAeC,GAApC;AAEA,SAAO,sBAAQ,MAAM;AACnB,WAAO;AACLG,MAAAA,SAAS,EAAEgB,YAAY,GAAGC,iCAAeC,IAAf,iCAAyBF,YAAzB;AAAuCpC,QAAAA;AAAvC,SAAH,GAAoDuC,SADtE;AAEL;AACAnC,MAAAA,KAAK,EAAEA,KAAK,GACR,KAAIoC,gCAAJ,EAAmB,GAAnB,EAAwBpC,KAAK,CAACqC,OAA9B,CADQ,GAER,CAACL,YAAD,IAAiB,CAAC/B,OAAlB,GACA,KAAImC,gCAAJ,EAAmB,GAAnB,CADA,GAEAD;AAPC,KAAP;AASD,GAVM,EAUJ,CAACH,YAAD,EAAepC,IAAf,EAAqBI,KAArB,CAVI,CAAP;AAWD","sourcesContent":["import { useMemo, useEffect, useRef } from 'react';\nimport { gql } from '@apollo/client';\nimport { useDataQuery } from '@teambit/ui-foundation.ui.hooks.use-data-query';\nimport { ComponentID, ComponentIdObj } from '@teambit/component-id';\n\nimport { ComponentModel } from './component-model';\nimport { ComponentError } from './component-error';\n\nconst componentIdFields = gql`\n  fragment componentIdFields on ComponentID {\n    name\n    version\n    scope\n  }\n`;\n\nconst componentFields = gql`\n  fragment componentFields on Component {\n    id {\n      ...componentIdFields\n    }\n    packageName\n    elementsUrl\n    description\n    labels\n    displayName\n    latest\n    server {\n      env\n      url\n    }\n    buildStatus\n    compositions {\n      identifier\n      displayName\n    }\n    tags {\n      version\n    }\n    env {\n      id\n      icon\n    }\n    preview {\n      includesEnvTemplate\n    }\n  }\n  ${componentIdFields}\n`;\n\nconst GET_COMPONENT = gql`\n  query Component($id: String!, $extensionId: String!) {\n    getHost(id: $extensionId) {\n      id # used for GQL caching\n      get(id: $id) {\n        ...componentFields\n      }\n    }\n  }\n  ${componentFields}\n`;\n\nconst SUB_SUBSCRIPTION_ADDED = gql`\n  subscription OnComponentAdded {\n    componentAdded {\n      component {\n        ...componentFields\n      }\n    }\n  }\n  ${componentFields}\n`;\n\nconst SUB_COMPONENT_CHANGED = gql`\n  subscription OnComponentChanged {\n    componentChanged {\n      component {\n        ...componentFields\n      }\n    }\n  }\n  ${componentFields}\n`;\n\nconst SUB_COMPONENT_REMOVED = gql`\n  subscription OnComponentRemoved {\n    componentRemoved {\n      componentIds {\n        ...componentIdFields\n      }\n    }\n  }\n  ${componentIdFields}\n`;\n\n/** provides data to component ui page, making sure both variables and return value are safely typed and memoized */\nexport function useComponentQuery(componentId: string, host: string) {\n  const idRef = useRef(componentId);\n  idRef.current = componentId;\n  const { data, error, loading, subscribeToMore } = useDataQuery(GET_COMPONENT, {\n    variables: { id: componentId, extensionId: host },\n  });\n\n  useEffect(() => {\n    // @TODO @Kutner fix subscription for scope\n    if (host !== 'teambit.workspace/workspace') {\n      return () => {};\n    }\n\n    const unsubAddition = subscribeToMore({\n      document: SUB_SUBSCRIPTION_ADDED,\n      updateQuery: (prev, { subscriptionData }) => {\n        const prevComponent = prev?.getHost?.get;\n        const addedComponent = subscriptionData?.data?.componentAdded?.component;\n\n        if (!addedComponent || prevComponent) return prev;\n\n        if (idRef.current === addedComponent.id.name) {\n          return {\n            ...prev,\n            getHost: {\n              ...prev.getHost,\n              get: addedComponent,\n            },\n          };\n        }\n\n        return prev;\n      },\n    });\n\n    const unsubChanges = subscribeToMore({\n      document: SUB_COMPONENT_CHANGED,\n      updateQuery: (prev, { subscriptionData }) => {\n        if (!subscriptionData.data) return prev;\n\n        const prevComponent = prev?.getHost?.get;\n        const updatedComponent = subscriptionData?.data?.componentChanged?.component;\n\n        const isUpdated = updatedComponent && ComponentID.isEqualObj(prevComponent?.id, updatedComponent?.id);\n\n        if (isUpdated) {\n          return {\n            ...prev,\n            getHost: {\n              ...prev.getHost,\n              get: updatedComponent,\n            },\n          };\n        }\n\n        return prev;\n      },\n    });\n\n    const unsubRemoval = subscribeToMore({\n      document: SUB_COMPONENT_REMOVED,\n      updateQuery: (prev, { subscriptionData }) => {\n        if (!subscriptionData.data) return prev;\n\n        const prevComponent = prev?.getHost?.get;\n        const removedIds: ComponentIdObj[] | undefined = subscriptionData?.data?.componentRemoved?.componentIds;\n        if (!prevComponent || !removedIds?.length) return prev;\n\n        const isRemoved = removedIds.some((removedId) => ComponentID.isEqualObj(removedId, prevComponent.id));\n\n        if (isRemoved) {\n          return {\n            ...prev,\n            getHost: {\n              ...prev.getHost,\n              get: null,\n            },\n          };\n        }\n\n        return prev;\n      },\n    });\n\n    return () => {\n      unsubChanges();\n      unsubAddition();\n      unsubRemoval();\n    };\n  }, []);\n\n  const rawComponent = data?.getHost?.get;\n\n  return useMemo(() => {\n    return {\n      component: rawComponent ? ComponentModel.from({ ...rawComponent, host }) : undefined,\n      // eslint-disable-next-line\n      error: error\n        ? new ComponentError(500, error.message)\n        : !rawComponent && !loading\n        ? new ComponentError(404)\n        : undefined,\n    };\n  }, [rawComponent, host, error]);\n}\n"]}
+{"version":3,"sources":["use-component-query.ts"],"names":["componentIdFields","componentFields","GET_COMPONENT","SUB_SUBSCRIPTION_ADDED","SUB_COMPONENT_CHANGED","SUB_COMPONENT_REMOVED","useComponentQuery","componentId","host","idRef","current","data","error","loading","subscribeToMore","variables","id","extensionId","unsubAddition","document","updateQuery","prev","subscriptionData","prevComponent","getHost","get","addedComponent","componentAdded","component","name","unsubChanges","updatedComponent","componentChanged","isUpdated","ComponentID","isEqualObj","unsubRemoval","removedIds","componentRemoved","componentIds","length","isRemoved","some","removedId","rawComponent","aspectList","entries","aspects","map","aspect","aspectId","aspectData","fromObject","componentDescriptor","ComponentDescriptor","toString","undefined","ComponentModel","from","ComponentError","message"],"mappings":"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","sourcesContent":["import { useMemo, useEffect, useRef } from 'react';\nimport { gql } from '@apollo/client';\nimport { useDataQuery } from '@teambit/ui-foundation.ui.hooks.use-data-query';\nimport { ComponentID, ComponentIdObj } from '@teambit/component-id';\nimport { ComponentDescriptor } from '@teambit/component-descriptor';\n\nimport { ComponentModel } from './component-model';\nimport { ComponentError } from './component-error';\n\nconst componentIdFields = gql`\n  fragment componentIdFields on ComponentID {\n    name\n    version\n    scope\n  }\n`;\n\nconst componentFields = gql`\n  fragment componentFields on Component {\n    id {\n      ...componentIdFields\n    }\n    aspects(include: [\"teambit.preview/preview\"]) {\n      id\n      data\n    }\n    packageName\n    elementsUrl\n    description\n    labels\n    displayName\n    latest\n    server {\n      env\n      url\n    }\n    buildStatus\n    compositions {\n      identifier\n      displayName\n    }\n    tags {\n      version\n    }\n    env {\n      id\n      icon\n    }\n\n    preview {\n      includesEnvTemplate\n    }\n  }\n  ${componentIdFields}\n`;\n\nconst GET_COMPONENT = gql`\n  query Component($id: String!, $extensionId: String!) {\n    getHost(id: $extensionId) {\n      id # used for GQL caching\n      get(id: $id) {\n        ...componentFields\n      }\n    }\n  }\n  ${componentFields}\n`;\n\nconst SUB_SUBSCRIPTION_ADDED = gql`\n  subscription OnComponentAdded {\n    componentAdded {\n      component {\n        ...componentFields\n      }\n    }\n  }\n  ${componentFields}\n`;\n\nconst SUB_COMPONENT_CHANGED = gql`\n  subscription OnComponentChanged {\n    componentChanged {\n      component {\n        ...componentFields\n      }\n    }\n  }\n  ${componentFields}\n`;\n\nconst SUB_COMPONENT_REMOVED = gql`\n  subscription OnComponentRemoved {\n    componentRemoved {\n      componentIds {\n        ...componentIdFields\n      }\n    }\n  }\n  ${componentIdFields}\n`;\n\n/** provides data to component ui page, making sure both variables and return value are safely typed and memoized */\nexport function useComponentQuery(componentId: string, host: string) {\n  const idRef = useRef(componentId);\n  idRef.current = componentId;\n  const { data, error, loading, subscribeToMore } = useDataQuery(GET_COMPONENT, {\n    variables: { id: componentId, extensionId: host },\n  });\n\n  useEffect(() => {\n    // @TODO @Kutner fix subscription for scope\n    if (host !== 'teambit.workspace/workspace') {\n      return () => {};\n    }\n\n    const unsubAddition = subscribeToMore({\n      document: SUB_SUBSCRIPTION_ADDED,\n      updateQuery: (prev, { subscriptionData }) => {\n        const prevComponent = prev?.getHost?.get;\n        const addedComponent = subscriptionData?.data?.componentAdded?.component;\n\n        if (!addedComponent || prevComponent) return prev;\n\n        if (idRef.current === addedComponent.id.name) {\n          return {\n            ...prev,\n            getHost: {\n              ...prev.getHost,\n              get: addedComponent,\n            },\n          };\n        }\n\n        return prev;\n      },\n    });\n\n    const unsubChanges = subscribeToMore({\n      document: SUB_COMPONENT_CHANGED,\n      updateQuery: (prev, { subscriptionData }) => {\n        if (!subscriptionData.data) return prev;\n\n        const prevComponent = prev?.getHost?.get;\n        const updatedComponent = subscriptionData?.data?.componentChanged?.component;\n\n        const isUpdated = updatedComponent && ComponentID.isEqualObj(prevComponent?.id, updatedComponent?.id);\n\n        if (isUpdated) {\n          return {\n            ...prev,\n            getHost: {\n              ...prev.getHost,\n              get: updatedComponent,\n            },\n          };\n        }\n\n        return prev;\n      },\n    });\n\n    const unsubRemoval = subscribeToMore({\n      document: SUB_COMPONENT_REMOVED,\n      updateQuery: (prev, { subscriptionData }) => {\n        if (!subscriptionData.data) return prev;\n\n        const prevComponent = prev?.getHost?.get;\n        const removedIds: ComponentIdObj[] | undefined = subscriptionData?.data?.componentRemoved?.componentIds;\n        if (!prevComponent || !removedIds?.length) return prev;\n\n        const isRemoved = removedIds.some((removedId) => ComponentID.isEqualObj(removedId, prevComponent.id));\n\n        if (isRemoved) {\n          return {\n            ...prev,\n            getHost: {\n              ...prev.getHost,\n              get: null,\n            },\n          };\n        }\n\n        return prev;\n      },\n    });\n\n    return () => {\n      unsubChanges();\n      unsubAddition();\n      unsubRemoval();\n    };\n  }, []);\n\n  const rawComponent = data?.getHost?.get;\n  return useMemo(() => {\n    const aspectList = {\n      entries: rawComponent?.aspects?.map((aspect) => ({ aspectId: aspect.id, aspectData: aspect.data })),\n    };\n    const id = rawComponent && ComponentID.fromObject(rawComponent.id);\n    return {\n      componentDescriptor: id ? ComponentDescriptor.fromObject({ id: id.toString(), aspectList }) : undefined,\n      component: rawComponent ? ComponentModel.from({ ...rawComponent, host }) : undefined,\n      // eslint-disable-next-line\n      error: error\n        ? new ComponentError(500, error.message)\n        : !rawComponent && !loading\n        ? new ComponentError(404)\n        : undefined,\n    };\n  }, [rawComponent, host, error]);\n}\n"]}

package/dist/ui/use-component.d.ts

@@ -1,8 +1,10 @@
 import { ComponentID } from '@teambit/component-id';
+import { ComponentDescriptor } from '@teambit/component-descriptor';
 import { ComponentModel } from './component-model';
 import { ComponentError } from './component-error';
 export declare type Component = {
     component?: ComponentModel;
     error?: ComponentError;
+    componentDescriptor?: ComponentDescriptor;
 };
 export declare function useComponent(host: string, id?: ComponentID): Component;

package/dist/ui/use-component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["use-component.tsx"],"names":["useComponent","host","id","params","componentId","query","version","get","undefined","targetId","toString","ignoreVersion","TypeError","withVersion","includes"],"mappings":";;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAWO,SAASA,YAAT,CAAsBC,IAAtB,EAAoCC,EAApC,EAAiE;AACtE,QAAM;AACJC,IAAAA,MAAM,EAAE;AAAEC,MAAAA;AAAF;AADJ,MAEF,sCAFJ;AAGA,QAAMC,KAAK,GAAG,4CAAd;AACA,QAAMC,OAAO,GAAGD,KAAK,CAACE,GAAN,CAAU,SAAV,KAAwBC,SAAxC;AAEA,QAAMC,QAAQ,GAAG,CAAAP,EAAE,SAAF,IAAAA,EAAE,WAAF,YAAAA,EAAE,CAAEQ,QAAJ,CAAa;AAAEC,IAAAA,aAAa,EAAE;AAAjB,GAAb,MAAyCP,WAA1D;AACA,MAAI,CAACK,QAAL,EAAe,MAAM,IAAIG,SAAJ,CAAc,uCAAd,CAAN;AAEf,SAAO,4CAAkBC,WAAW,CAACJ,QAAD,EAAWH,OAAX,CAA7B,EAAkDL,IAAlD,CAAP;AACD;;AAED,SAASY,WAAT,CAAqBX,EAArB,EAAiCI,OAAjC,EAAmD;AACjD,MAAI,CAACA,OAAL,EAAc,OAAOJ,EAAP;AACd,MAAIA,EAAE,CAACY,QAAH,CAAY,GAAZ,CAAJ,EAAsB,OAAOZ,EAAP;AACtB,SAAQ,GAAEA,EAAG,IAAGI,OAAQ,EAAxB;AACD","sourcesContent":["import { useRouteMatch } from 'react-router-dom';\nimport { ComponentID } from '@teambit/component-id';\nimport { useQuery } from '@teambit/ui-foundation.ui.react-router.use-query';\nimport { ComponentModel } from './component-model';\nimport { ComponentError } from './component-error';\nimport { useComponentQuery } from './use-component-query';\n\nexport type Component = {\n  component?: ComponentModel;\n  error?: ComponentError;\n};\n\ntype ComponentRoute = {\n  componentId?: string;\n};\n\nexport function useComponent(host: string, id?: ComponentID): Component {\n  const {\n    params: { componentId },\n  } = useRouteMatch<ComponentRoute>();\n  const query = useQuery();\n  const version = query.get('version') || undefined;\n\n  const targetId = id?.toString({ ignoreVersion: true }) || componentId;\n  if (!targetId) throw new TypeError('useComponent received no component id');\n\n  return useComponentQuery(withVersion(targetId, version), host);\n}\n\nfunction withVersion(id: string, version?: string) {\n  if (!version) return id;\n  if (id.includes('@')) return id;\n  return `${id}@${version}`;\n}\n"]}
+{"version":3,"sources":["use-component.tsx"],"names":["useComponent","host","id","params","componentId","query","version","get","undefined","targetId","toString","ignoreVersion","TypeError","withVersion","includes"],"mappings":";;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAIA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAYO,SAASA,YAAT,CAAsBC,IAAtB,EAAoCC,EAApC,EAAiE;AACtE,QAAM;AACJC,IAAAA,MAAM,EAAE;AAAEC,MAAAA;AAAF;AADJ,MAEF,sCAFJ;AAGA,QAAMC,KAAK,GAAG,4CAAd;AACA,QAAMC,OAAO,GAAGD,KAAK,CAACE,GAAN,CAAU,SAAV,KAAwBC,SAAxC;AAEA,QAAMC,QAAQ,GAAG,CAAAP,EAAE,SAAF,IAAAA,EAAE,WAAF,YAAAA,EAAE,CAAEQ,QAAJ,CAAa;AAAEC,IAAAA,aAAa,EAAE;AAAjB,GAAb,MAAyCP,WAA1D;AACA,MAAI,CAACK,QAAL,EAAe,MAAM,IAAIG,SAAJ,CAAc,uCAAd,CAAN;AACf,SAAO,4CAAkBC,WAAW,CAACJ,QAAD,EAAWH,OAAX,CAA7B,EAAkDL,IAAlD,CAAP;AACD;;AAED,SAASY,WAAT,CAAqBX,EAArB,EAAiCI,OAAjC,EAAmD;AACjD,MAAI,CAACA,OAAL,EAAc,OAAOJ,EAAP;AACd,MAAIA,EAAE,CAACY,QAAH,CAAY,GAAZ,CAAJ,EAAsB,OAAOZ,EAAP;AACtB,SAAQ,GAAEA,EAAG,IAAGI,OAAQ,EAAxB;AACD","sourcesContent":["import { useRouteMatch } from 'react-router-dom';\nimport { ComponentID } from '@teambit/component-id';\nimport { useQuery } from '@teambit/ui-foundation.ui.react-router.use-query';\nimport { ComponentDescriptor } from '@teambit/component-descriptor';\nimport { ComponentModel } from './component-model';\nimport { ComponentError } from './component-error';\nimport { useComponentQuery } from './use-component-query';\n\nexport type Component = {\n  component?: ComponentModel;\n  error?: ComponentError;\n  componentDescriptor?: ComponentDescriptor;\n};\n\ntype ComponentRoute = {\n  componentId?: string;\n};\n\nexport function useComponent(host: string, id?: ComponentID): Component {\n  const {\n    params: { componentId },\n  } = useRouteMatch<ComponentRoute>();\n  const query = useQuery();\n  const version = query.get('version') || undefined;\n\n  const targetId = id?.toString({ ignoreVersion: true }) || componentId;\n  if (!targetId) throw new TypeError('useComponent received no component id');\n  return useComponentQuery(withVersion(targetId, version), host);\n}\n\nfunction withVersion(id: string, version?: string) {\n  if (!version) return id;\n  if (id.includes('@')) return id;\n  return `${id}@${version}`;\n}\n"]}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/component",
-  "version": "0.0.649",
+  "version": "0.0.653",
   "homepage": "https://bit.dev/teambit/component/component",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.component",
     "name": "component",
-    "version": "0.0.649"
+    "version": "0.0.653"
   },
   "dependencies": {
     "@teambit/any-fs": "0.0.5",
@@ -28,37 +28,38 @@
     "@teambit/documenter.ui.separator": "4.1.1",
     "@teambit/base-ui.routing.routing-provider": "1.0.0",
     "@teambit/component-id": "0.0.401",
-    "@teambit/ui-foundation.ui.menu-widget-icon": "0.0.487",
-    "@teambit/aspect-loader": "0.0.649",
+    "@teambit/ui-foundation.ui.menu-widget-icon": "0.0.488",
+    "@teambit/aspect-loader": "0.0.653",
     "@teambit/legacy-bit-id": "0.0.398",
-    "@teambit/toolbox.string.capitalize": "0.0.482",
-    "@teambit/cli": "0.0.443",
-    "@teambit/config": "0.0.456",
-    "@teambit/express": "0.0.537",
-    "@teambit/graphql": "0.0.649",
+    "@teambit/toolbox.string.capitalize": "0.0.483",
+    "@teambit/cli": "0.0.445",
+    "@teambit/config": "0.0.458",
+    "@teambit/express": "0.0.539",
+    "@teambit/graphql": "0.0.653",
     "@teambit/bit-error": "0.0.394",
-    "@teambit/command-bar": "0.0.649",
-    "@teambit/preview": "0.0.649",
-    "@teambit/pubsub": "0.0.649",
-    "@teambit/ui-foundation.ui.is-browser": "0.0.485",
-    "@teambit/ui-foundation.ui.main-dropdown": "0.0.485",
-    "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.487",
-    "@teambit/ui-foundation.ui.use-box.menu": "0.0.109",
-    "@teambit/ui": "0.0.649",
+    "@teambit/command-bar": "0.0.653",
+    "@teambit/preview": "0.0.653",
+    "@teambit/pubsub": "0.0.653",
+    "@teambit/ui-foundation.ui.is-browser": "0.0.486",
+    "@teambit/ui-foundation.ui.main-dropdown": "0.0.486",
+    "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.488",
+    "@teambit/ui-foundation.ui.use-box.menu": "0.0.110",
+    "@teambit/ui": "0.0.653",
     "@teambit/component-issues": "0.0.46",
-    "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.486",
+    "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.487",
     "@teambit/cli-table": "0.0.33",
-    "@teambit/ui-foundation.ui.react-router.use-query": "0.0.485",
+    "@teambit/component-descriptor": "0.0.3",
+    "@teambit/ui-foundation.ui.react-router.use-query": "0.0.486",
+    "@teambit/compositions": "0.0.653",
+    "@teambit/deprecation": "0.0.653",
+    "@teambit/envs": "0.0.653",
     "@teambit/design.ui.empty-box": "0.0.353",
-    "@teambit/harmony.ui.aspect-box": "0.0.485",
+    "@teambit/harmony.ui.aspect-box": "0.0.486",
     "@teambit/design.ui.pages.not-found": "0.0.353",
     "@teambit/design.ui.pages.server-error": "0.0.353",
-    "@teambit/compositions": "0.0.649",
-    "@teambit/deprecation": "0.0.649",
-    "@teambit/envs": "0.0.649",
-    "@teambit/component.ui.version-dropdown": "0.0.491",
-    "@teambit/ui-foundation.ui.use-box.dropdown": "0.0.109",
-    "@teambit/ui-foundation.ui.react-router.extend-path": "0.0.485"
+    "@teambit/component.ui.version-dropdown": "0.0.492",
+    "@teambit/ui-foundation.ui.use-box.dropdown": "0.0.110",
+    "@teambit/ui-foundation.ui.react-router.extend-path": "0.0.486"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -68,16 +69,16 @@
     "@types/react-router-dom": "5.1.7",
     "@types/lodash.flatten": "4.4.6",
     "@types/classnames": "2.2.11",
-    "@types/mocha": "5.2.7",
+    "@types/mocha": "9.1.0",
     "@types/testing-library__jest-dom": "5.9.5",
     "@types/jest": "^26.0.0",
     "@types/react-dom": "^17.0.5",
     "@types/node": "12.20.4",
-    "@teambit/component.aspect-docs.component": "0.0.131"
+    "@teambit/component.aspect-docs.component": "0.0.132"
   },
   "peerDependencies": {
     "@apollo/client": "^3.0.0",
-    "@teambit/legacy": "1.0.221",
+    "@teambit/legacy": "1.0.223",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -95,7 +96,7 @@
       },
       "devDependencies": {
         "@teambit/legacy": "-",
-        "@types/mocha": "5.2.7",
+        "@types/mocha": "9.1.0",
         "@types/testing-library__jest-dom": "5.9.5",
         "@types/jest": "^26.0.0",
         "@types/react-dom": "^17.0.5",
@@ -105,7 +106,7 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.221",
+        "@teambit/legacy": "1.0.223",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/ui/use-component-query.ts

@@ -2,6 +2,7 @@ import { useMemo, useEffect, useRef } from 'react';
 import { gql } from '@apollo/client';
 import { useDataQuery } from '@teambit/ui-foundation.ui.hooks.use-data-query';
 import { ComponentID, ComponentIdObj } from '@teambit/component-id';
+import { ComponentDescriptor } from '@teambit/component-descriptor';
 
 import { ComponentModel } from './component-model';
 import { ComponentError } from './component-error';
@@ -19,6 +20,10 @@ const componentFields = gql`
     id {
       ...componentIdFields
     }
+    aspects(include: ["teambit.preview/preview"]) {
+      id
+      data
+    }
     packageName
     elementsUrl
     description
@@ -41,6 +46,7 @@ const componentFields = gql`
       id
       icon
     }
+
     preview {
       includesEnvTemplate
     }
@@ -186,9 +192,13 @@ export function useComponentQuery(componentId: string, host: string) {
   }, []);
 
   const rawComponent = data?.getHost?.get;
-
   return useMemo(() => {
+    const aspectList = {
+      entries: rawComponent?.aspects?.map((aspect) => ({ aspectId: aspect.id, aspectData: aspect.data })),
+    };
+    const id = rawComponent && ComponentID.fromObject(rawComponent.id);
     return {
+      componentDescriptor: id ? ComponentDescriptor.fromObject({ id: id.toString(), aspectList }) : undefined,
       component: rawComponent ? ComponentModel.from({ ...rawComponent, host }) : undefined,
       // eslint-disable-next-line
       error: error

package/ui/use-component.tsx

@@ -1,6 +1,7 @@
 import { useRouteMatch } from 'react-router-dom';
 import { ComponentID } from '@teambit/component-id';
 import { useQuery } from '@teambit/ui-foundation.ui.react-router.use-query';
+import { ComponentDescriptor } from '@teambit/component-descriptor';
 import { ComponentModel } from './component-model';
 import { ComponentError } from './component-error';
 import { useComponentQuery } from './use-component-query';
@@ -8,6 +9,7 @@ import { useComponentQuery } from './use-component-query';
 export type Component = {
   component?: ComponentModel;
   error?: ComponentError;
+  componentDescriptor?: ComponentDescriptor;
 };
 
 type ComponentRoute = {
@@ -23,7 +25,6 @@ export function useComponent(host: string, id?: ComponentID): Component {
 
   const targetId = id?.toString({ ignoreVersion: true }) || componentId;
   if (!targetId) throw new TypeError('useComponent received no component id');
-
   return useComponentQuery(withVersion(targetId, version), host);
 }