@teambit/component 0.0.876 → 0.0.878

package/dist/component.graphql.js

@@ -156,18 +156,19 @@ function componentSchema(componentExtension) {
           """
           type of logs to show (tag or snap)
           """
-          type: String,
-          offset: Int,
-          limit: Int,
+          type: String
+          offset: Int
+          limit: Int
           """
           head to start traversing logs from
           """
-          head: String,
-          sort: String,
+          head: String
+          sort: String
           """
           start traversing logs from the fetched component's head
           """
-          takeHeadFromComponent: Boolean): [LogEntry]!
+          takeHeadFromComponent: Boolean
+        ): [LogEntry]!
 
         aspects(include: [String]): [Aspect]
       }

package/dist/component.graphql.js.map

@@ -1 +1 @@
-{"version":3,"names":["componentSchema","componentExtension","typeDefs","gql","resolvers","JSONObject","GraphQLJSONObject","Component","id","component","toObject","displayName","fs","state","filesystem","files","map","file","relative","getFile","path","maybeFile","find","pathNormalizeToLinux","undefined","contents","toString","mainFile","_consumer","headTag","latest","tags","toArray","tag","aspects","include","filter","serialize","logs","head","takeHeadFromComponent","version","finalFilter","getLogs","log","hash","ComponentHost","get","host","componentId","resolveComponentId","error","snaps","list","listInvalid","invalidComps","err","errorName","name","errorMessage","message","stripAnsi","Query","getHost","componentExt"],"sources":["component.graphql.ts"],"sourcesContent":["import stripAnsi from 'strip-ansi';\nimport gql from 'graphql-tag';\nimport { GraphQLJSONObject } from 'graphql-type-json';\nimport { pathNormalizeToLinux } from '@teambit/legacy/dist/utils';\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: [String]!\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        \"\"\"\n        component logs\n        \"\"\"\n        logs(\n          \"\"\"\n          type of logs to show (tag or snap)\n          \"\"\"\n          type: String,\n          offset: Int,\n          limit: Int,\n          \"\"\"\n          head to start traversing logs from\n          \"\"\"\n          head: String,\n          sort: String,\n          \"\"\"\n          start traversing logs from the fetched component's head\n          \"\"\"\n          takeHeadFromComponent: Boolean): [LogEntry]!\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]! @deprecated(reason: \"Use the logs field on Component\")\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        logs: async (\n          component: Component,\n          filter?: {\n            type?: string;\n            offset?: number;\n            limit?: number;\n            head?: string;\n            sort?: string;\n            takeHeadFromComponent: boolean;\n          }\n        ) => {\n          let head = filter?.head;\n          if (!head && filter?.takeHeadFromComponent) {\n            head = component.id.version;\n          }\n          const finalFilter = { ...filter, ...{ head } };\n          return (await component.getLogs(finalFilter)).map((log) => ({ ...log, id: log.hash }));\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"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;;;;;AAKO,SAASA,eAAT,CAAyBC,kBAAzB,EAA4D;EACjE,OAAO;IACLC,QAAQ,EAAE,IAAAC,qBAAA,CAAI;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KA7IS;IA8ILC,SAAS,EAAE;MACTC,UAAU,EAAEC,oCADH;MAETC,SAAS,EAAE;QACTC,EAAE,EAAGC,SAAD,IAA0BA,SAAS,CAACD,EAAV,CAAaE,QAAb,EADrB;QAETC,WAAW,EAAGF,SAAD,IAA0BA,SAAS,CAACE,WAFxC;QAGTC,EAAE,EAAGH,SAAD,IAA0B;UAC5B,OAAOA,SAAS,CAACI,KAAV,CAAgBC,UAAhB,CAA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"}
+{"version":3,"names":["componentSchema","componentExtension","typeDefs","gql","resolvers","JSONObject","GraphQLJSONObject","Component","id","component","toObject","displayName","fs","state","filesystem","files","map","file","relative","getFile","path","maybeFile","find","pathNormalizeToLinux","undefined","contents","toString","mainFile","_consumer","headTag","latest","tags","toArray","tag","aspects","include","filter","serialize","logs","head","takeHeadFromComponent","version","finalFilter","getLogs","log","hash","ComponentHost","get","host","componentId","resolveComponentId","error","snaps","list","listInvalid","invalidComps","err","errorName","name","errorMessage","message","stripAnsi","Query","getHost","componentExt"],"sources":["component.graphql.ts"],"sourcesContent":["import stripAnsi from 'strip-ansi';\nimport gql from 'graphql-tag';\nimport { GraphQLJSONObject } from 'graphql-type-json';\nimport { pathNormalizeToLinux } from '@teambit/legacy/dist/utils';\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: [String]!\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        \"\"\"\n        component logs\n        \"\"\"\n        logs(\n          \"\"\"\n          type of logs to show (tag or snap)\n          \"\"\"\n          type: String\n          offset: Int\n          limit: Int\n          \"\"\"\n          head to start traversing logs from\n          \"\"\"\n          head: String\n          sort: String\n          \"\"\"\n          start traversing logs from the fetched component's head\n          \"\"\"\n          takeHeadFromComponent: Boolean\n        ): [LogEntry]!\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]! @deprecated(reason: \"Use the logs field on Component\")\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        logs: async (\n          component: Component,\n          filter?: {\n            type?: string;\n            offset?: number;\n            limit?: number;\n            head?: string;\n            sort?: string;\n            takeHeadFromComponent: boolean;\n          }\n        ) => {\n          let head = filter?.head;\n          if (!head && filter?.takeHeadFromComponent) {\n            head = component.id.version;\n          }\n          const finalFilter = { ...filter, ...{ head } };\n          return (await component.getLogs(finalFilter)).map((log) => ({ ...log, id: log.hash }));\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"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;AACA;EAAA;;EAAA;IAAA;EAAA;;EAAA;AAAA;;;;;;AAKO,SAASA,eAAT,CAAyBC,kBAAzB,EAA4D;EACjE,OAAO;IACLC,QAAQ,EAAE,IAAAC,qBAAA,CAAI;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KA9IS;IA+ILC,SAAS,EAAE;MACTC,UAAU,EAAEC,oCADH;MAETC,SAAS,EAAE;QACTC,EAAE,EAAGC,SAAD,IAA0BA,SAAS,CAACD,EAAV,CAAaE,QAAb,EADrB;QAETC,WAAW,EAAGF,SAAD,IAA0BA,SAAS,CAACE,WAFxC;QAGTC,EAAE,EAAGH,SAAD,IAA0B;UAC5B,OAAOA,SAAS,CAACI,KAAV,CAAgBC,UAAhB,CAA2BC,KAA3B,CAAiCC,GAAjC,CAAsCC,IAAD,IAAUA,IAAI,CAACC,QAApD,CAAP;QACD,CALQ;QAMTC,OAAO,EAAE,CAACV,SAAD,EAAuB;UAAEW;QAAF,CAAvB,KAAsD;UAC7D,MAAMC,SAAS,GAAGZ,SAAS,CAACI,KAAV,CAAgBC,UAAhB,CAA2BC,KAA3B,CAAiCO,IAAjC,CACfL,IAAD,IAAU,IAAAM,6BAAA,EAAqBN,IAAI,CAACC,QAA1B,MAAwCE,IADlC,CAAlB;UAGA,IAAI,CAACC,SAAL,EAAgB,OAAOG,SAAP;UAChB,OAAOH,SAAS,CAACI,QAAV,CAAmBC,QAAnB,CAA4B,OAA5B,CAAP;QACD,CAZQ;QAaTC,QAAQ,EAAGlB,SAAD,IAA0B;UAClC,OAAOA,SAAS,CAACI,KAAV,CAAgBe,SAAhB,CAA0BD,QAAjC;QACD,CAfQ;QAgBTE,OAAO,EAAGpB,SAAD;UAAA;;UAAA,6BAA0BA,SAAS,CAACoB,OAApC,uDAA0B,mBAAmBnB,QAAnB,EAA1B;QAAA,CAhBA;QAiBToB,MAAM,EAAGrB,SAAD,IAA0BA,SAAS,CAACqB,MAjBnC;QAkBTC,IAAI,EAAGtB,SAAD,IAAe;UACnB;UACA,OAAOA,SAAS,CAACsB,IAAV,CAAeC,OAAf,GAAyBhB,GAAzB,CAA8BiB,GAAD,IAASA,GAAG,CAACvB,QAAJ,EAAtC,CAAP;QACD,CArBQ;QAsBTwB,OAAO,EAAE,CAACzB,SAAD,EAAuB;UAAE0B;QAAF,CAAvB,KAA+D;UACtE,OAAO1B,SAAS,CAACI,KAAV,CAAgBqB,OAAhB,CAAwBE,MAAxB,CAA+BD,OAA/B,EAAwCE,SAAxC,EAAP;QACD,CAxBQ;QAyBTC,IAAI,EAAE,OACJ7B,SADI,EAEJ2B,MAFI,KAUD;UACH,IAAIG,IAAI,GAAGH,MAAH,aAAGA,MAAH,uBAAGA,MAAM,CAAEG,IAAnB;;UACA,IAAI,CAACA,IAAD,IAASH,MAAT,aAASA,MAAT,eAASA,MAAM,CAAEI,qBAArB,EAA4C;YAC1CD,IAAI,GAAG9B,SAAS,CAACD,EAAV,CAAaiC,OAApB;UACD;;UACD,MAAMC,WAAW,mCAAQN,MAAR,GAAmB;YAAEG;UAAF,CAAnB,CAAjB;;UACA,OAAO,CAAC,MAAM9B,SAAS,CAACkC,OAAV,CAAkBD,WAAlB,CAAP,EAAuC1B,GAAvC,CAA4C4B,GAAD,oCAAeA,GAAf;YAAoBpC,EAAE,EAAEoC,GAAG,CAACC;UAA5B,EAA3C,CAAP;QACD;MA1CQ,CAFF;MA8CTC,aAAa,EAAE;QACbC,GAAG,EAAE,OAAOC,IAAP,EAA+B;UAAExC;QAAF,CAA/B,KAA0D;UAC7D,IAAI;YACF,MAAMyC,WAAW,GAAG,MAAMD,IAAI,CAACE,kBAAL,CAAwB1C,EAAxB,CAA1B;YACA,MAAMC,SAAS,GAAG,MAAMuC,IAAI,CAACD,GAAL,CAASE,WAAT,CAAxB;YACA,OAAOxC,SAAP;UACD,CAJD,CAIE,OAAO0C,KAAP,EAAmB;YACnB,OAAO,IAAP;UACD;QACF,CATY;QAUbC,KAAK,EAAE,OAAOJ,IAAP,EAA+B;UAAExC;QAAF,CAA/B,KAA0D;UAC/D,MAAMyC,WAAW,GAAG,MAAMD,IAAI,CAACE,kBAAL,CAAwB1C,EAAxB,CAA1B,CAD+D,CAE/D;;UACA,OAAOwC,IAAI,CAACL,OAAL,CAAaM,WAAb,CAAP;QACD,CAdY;QAebI,IAAI,EAAE,OAAOL,IAAP,EAA+BZ,MAA/B,KAA8E;UAClF,OAAOY,IAAI,CAACK,IAAL,CAAUjB,MAAV,CAAP;QACD,CAjBY;QAkBbkB,WAAW,EAAE,MAAON,IAAP,IAAkC;UAC7C,MAAMO,YAAY,GAAG,MAAMP,IAAI,CAACM,WAAL,EAA3B;UACA,OAAOC,YAAY,CAACvC,GAAb,CAAiB,CAAC;YAAER,EAAF;YAAMgD;UAAN,CAAD,MAAkB;YACxChD,EADwC;YAExCiD,SAAS,EAAED,GAAG,CAACE,IAFyB;YAGxCC,YAAY,EAAEH,GAAG,CAACI,OAAJ,GAAc,IAAAC,oBAAA,EAAUL,GAAG,CAACI,OAAd,CAAd,GAAuCJ,GAAG,CAACE;UAHjB,CAAlB,CAAjB,CAAP;QAKD,CAzBY;QA0BblD,EAAE,EAAE,MAAOwC,IAAP,IAAkC;UACpC,OAAOA,IAAI,CAACU,IAAZ;QACD,CA5BY;QA6BbA,IAAI,EAAE,MAAOV,IAAP,IAAkC;UACtC,OAAOA,IAAI,CAACU,IAAZ;QACD;MA/BY,CA9CN;MA+ETI,KAAK,EAAE;QACLC,OAAO,EAAE,CAACC,YAAD,EAA8B;UAAExD;QAAF,CAA9B,KAAyD;UAChE,OAAOP,kBAAkB,CAAC8D,OAAnB,CAA2BvD,EAA3B,CAAP;QACD;MAHI;IA/EE;EA/IN,CAAP;AAqOD"}

package/dist/ui/component.d.ts

@@ -3,7 +3,6 @@ import { RouteSlot } from '@teambit/ui-foundation.ui.react-router.slot-router';
 import { SlotRegistry } from '@teambit/harmony';
 import { UseComponentType } from './use-component';
 import { ComponentModel } from './component-model';
-import { ComponentID } from '..';
 import { Filters } from './use-component-query';
 export declare type ComponentPageSlot = SlotRegistry<ComponentPageElement[]>;
 export declare type ComponentPageElement = {
@@ -16,7 +15,7 @@ export declare type ComponentProps = {
     host: string;
     onComponentChange?: (activeComponent?: ComponentModel) => void;
     useComponent?: UseComponentType;
-    useComponentFilters?: (componentId?: ComponentID) => Filters;
+    useComponentFilters?: () => Filters;
     path?: string;
     componentIdStr?: string | (() => string | undefined);
 };

package/dist/ui/component.js

@@ -127,9 +127,9 @@ function Component({
   const _componentIdStr = getComponentIdStr(componentIdStr);
 
   const componentId = _componentIdStr ? _().ComponentID.fromString(_componentIdStr) : undefined;
-  const resolvedComponentIdStr = path || (componentId === null || componentId === void 0 ? void 0 : componentId.toStringWithoutVersion()) || idFromLocation;
+  const resolvedComponentIdStr = path || idFromLocation;
   const useComponentOptions = {
-    logFilters: useComponentFilters === null || useComponentFilters === void 0 ? void 0 : useComponentFilters(componentId),
+    logFilters: useComponentFilters === null || useComponentFilters === void 0 ? void 0 : useComponentFilters(),
     customUseComponent: useComponent
   };
   const {

package/dist/ui/component.js.map

@@ -1 +1 @@
-{"version":3,"names":["getComponentIdStr","componentIdStr","isFunction","Component","routeSlot","containerSlot","host","onComponentChange","useComponent","path","useComponentFilters","idFromLocation","useIdFromLocation","_componentIdStr","componentId","ComponentID","fromString","undefined","resolvedComponentIdStr","toStringWithoutVersion","useComponentOptions","logFilters","customUseComponent","component","componentDescriptor","error","useComponentQuery","toString","useEffect","pageItems","useMemo","flatten","values","before","filter","x","type","map","content","after","renderError","styles","container"],"sources":["component.tsx"],"sourcesContent":["import React, { useEffect, ReactNode, useMemo } from 'react';\nimport flatten from 'lodash.flatten';\nimport { RouteSlot, SlotRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { SlotRegistry } from '@teambit/harmony';\nimport { isFunction } from 'lodash';\nimport styles from './component.module.scss';\nimport { ComponentProvider, ComponentDescriptorProvider } from './context';\nimport { useComponent as useComponentQuery, UseComponentType } from './use-component';\nimport { ComponentModel } from './component-model';\nimport { useIdFromLocation } from './use-component-from-location';\nimport { ComponentID } from '..';\nimport { Filters } from './use-component-query';\n\nexport type ComponentPageSlot = SlotRegistry<ComponentPageElement[]>;\nexport type ComponentPageElement = {\n  type: 'before' | 'after';\n  content: ReactNode;\n};\n\nexport type ComponentProps = {\n  containerSlot?: ComponentPageSlot;\n  routeSlot: RouteSlot;\n  host: string;\n  onComponentChange?: (activeComponent?: ComponentModel) => void;\n  useComponent?: UseComponentType;\n  useComponentFilters?: (componentId?: ComponentID) => Filters;\n  path?: string;\n  componentIdStr?: string | (() => string | undefined);\n};\n\nfunction getComponentIdStr(componentIdStr?: string | (() => string | undefined)): string | undefined {\n  if (isFunction(componentIdStr)) return componentIdStr();\n  return componentIdStr;\n}\n\n/**\n * main UI component of the Component extension.\n */\nexport function Component({\n  routeSlot,\n  containerSlot,\n  host,\n  onComponentChange,\n  componentIdStr,\n  useComponent,\n  path,\n  useComponentFilters,\n}: ComponentProps) {\n  const idFromLocation = useIdFromLocation();\n  const _componentIdStr = getComponentIdStr(componentIdStr);\n  const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;\n  const resolvedComponentIdStr = path || componentId?.toStringWithoutVersion() || idFromLocation;\n  const useComponentOptions = {\n    logFilters: useComponentFilters?.(componentId),\n    customUseComponent: useComponent,\n  };\n\n  const { component, componentDescriptor, error } = useComponentQuery(\n    host,\n    componentId?.toString() || idFromLocation,\n    useComponentOptions\n  );\n  // trigger onComponentChange when component changes\n  useEffect(() => onComponentChange?.(component), [component]);\n  // cleanup when unmounting component\n  useEffect(() => () => onComponentChange?.(undefined), []);\n\n  const pageItems = useMemo(() => flatten(containerSlot?.values()), [containerSlot]);\n  const before = useMemo(() => pageItems.filter((x) => x.type === 'before').map((x) => x.content), [pageItems]);\n  const after = useMemo(() => pageItems.filter((x) => x.type === 'after').map((x) => x.content), [pageItems]);\n\n  if (error) return error.renderError();\n  if (!component) return <div></div>;\n\n  return (\n    <ComponentDescriptorProvider componentDescriptor={componentDescriptor}>\n      <ComponentProvider component={component}>\n        {before}\n        <div className={styles.container}>\n          {routeSlot && <SlotRouter parentPath={`${resolvedComponentIdStr}/*`} slot={routeSlot} />}\n        </div>\n        {after}\n      </ComponentProvider>\n    </ComponentDescriptorProvider>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["getComponentIdStr","componentIdStr","isFunction","Component","routeSlot","containerSlot","host","onComponentChange","useComponent","path","useComponentFilters","idFromLocation","useIdFromLocation","_componentIdStr","componentId","ComponentID","fromString","undefined","resolvedComponentIdStr","useComponentOptions","logFilters","customUseComponent","component","componentDescriptor","error","useComponentQuery","toString","useEffect","pageItems","useMemo","flatten","values","before","filter","x","type","map","content","after","renderError","styles","container"],"sources":["component.tsx"],"sourcesContent":["import React, { useEffect, ReactNode, useMemo } from 'react';\nimport flatten from 'lodash.flatten';\nimport { RouteSlot, SlotRouter } from '@teambit/ui-foundation.ui.react-router.slot-router';\nimport { SlotRegistry } from '@teambit/harmony';\nimport { isFunction } from 'lodash';\nimport styles from './component.module.scss';\nimport { ComponentProvider, ComponentDescriptorProvider } from './context';\nimport { useComponent as useComponentQuery, UseComponentType } from './use-component';\nimport { ComponentModel } from './component-model';\nimport { useIdFromLocation } from './use-component-from-location';\nimport { ComponentID } from '..';\nimport { Filters } from './use-component-query';\n\nexport type ComponentPageSlot = SlotRegistry<ComponentPageElement[]>;\nexport type ComponentPageElement = {\n  type: 'before' | 'after';\n  content: ReactNode;\n};\n\nexport type ComponentProps = {\n  containerSlot?: ComponentPageSlot;\n  routeSlot: RouteSlot;\n  host: string;\n  onComponentChange?: (activeComponent?: ComponentModel) => void;\n  useComponent?: UseComponentType;\n  useComponentFilters?: () => Filters;\n  path?: string;\n  componentIdStr?: string | (() => string | undefined);\n};\n\nfunction getComponentIdStr(componentIdStr?: string | (() => string | undefined)): string | undefined {\n  if (isFunction(componentIdStr)) return componentIdStr();\n  return componentIdStr;\n}\n\n/**\n * main UI component of the Component extension.\n */\nexport function Component({\n  routeSlot,\n  containerSlot,\n  host,\n  onComponentChange,\n  componentIdStr,\n  useComponent,\n  path,\n  useComponentFilters,\n}: ComponentProps) {\n  const idFromLocation = useIdFromLocation();\n  const _componentIdStr = getComponentIdStr(componentIdStr);\n  const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;\n  const resolvedComponentIdStr = path || idFromLocation;\n  const useComponentOptions = {\n    logFilters: useComponentFilters?.(),\n    customUseComponent: useComponent,\n  };\n\n  const { component, componentDescriptor, error } = useComponentQuery(\n    host,\n    componentId?.toString() || idFromLocation,\n    useComponentOptions\n  );\n  // trigger onComponentChange when component changes\n  useEffect(() => onComponentChange?.(component), [component]);\n  // cleanup when unmounting component\n  useEffect(() => () => onComponentChange?.(undefined), []);\n\n  const pageItems = useMemo(() => flatten(containerSlot?.values()), [containerSlot]);\n  const before = useMemo(() => pageItems.filter((x) => x.type === 'before').map((x) => x.content), [pageItems]);\n  const after = useMemo(() => pageItems.filter((x) => x.type === 'after').map((x) => x.content), [pageItems]);\n\n  if (error) return error.renderError();\n  if (!component) return <div></div>;\n\n  return (\n    <ComponentDescriptorProvider componentDescriptor={componentDescriptor}>\n      <ComponentProvider component={component}>\n        {before}\n        <div className={styles.container}>\n          {routeSlot && <SlotRouter parentPath={`${resolvedComponentIdStr}/*`} slot={routeSlot} />}\n        </div>\n        {after}\n      </ComponentProvider>\n    </ComponentDescriptorProvider>\n  );\n}\n"],"mappings":"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"}

package/dist/ui/menu/menu.d.ts

@@ -2,7 +2,6 @@
 import { MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';
 import { UseComponentType } from '../use-component';
 import { OrderedNavigationSlot, ConsumeMethodSlot } from './nav-plugin';
-import { ComponentID } from '../..';
 import { Filters } from '../use-component-query';
 export declare type MenuProps = {
     className?: string;
@@ -23,7 +22,7 @@ export declare type MenuProps = {
     componentIdStr?: string | (() => string | undefined);
     useComponent?: UseComponentType;
     path?: string;
-    useComponentFilters?: (componentId?: ComponentID) => Filters;
+    useComponentFilters?: () => Filters;
 };
 /**
  * top bar menu.

package/dist/ui/menu/menu.js

@@ -225,9 +225,9 @@ function ComponentMenu({
   const _componentIdStr = getComponentIdStr(componentIdStr);
 
   const componentId = _componentIdStr ? _().ComponentID.fromString(_componentIdStr) : undefined;
-  const resolvedComponentIdStr = path || (componentId === null || componentId === void 0 ? void 0 : componentId.toStringWithoutVersion()) || idFromLocation;
+  const resolvedComponentIdStr = path || idFromLocation;
   const useComponentOptions = {
-    logFilters: useComponentFilters === null || useComponentFilters === void 0 ? void 0 : useComponentFilters(componentId),
+    logFilters: useComponentFilters === null || useComponentFilters === void 0 ? void 0 : useComponentFilters(),
     customUseComponent: useComponent
   };
   const {
@@ -281,7 +281,7 @@ function VersionRelatedDropdowns({
   const snaps = (0, _react().useMemo)(() => {
     return (logs || []).filter(log => !log.tag).map(snap => _objectSpread(_objectSpread({}, snap), {}, {
       version: snap.hash
-    })).reverse();
+    }));
   }, [logs]);
   const tags = (0, _react().useMemo)(() => {
     var _component$tags;

package/dist/ui/menu/menu.js.map

@@ -1 +1 @@
-{"version":3,"names":["getComponentIdStr","componentIdStr","isFunction","ComponentMenu","navigationSlot","widgetSlot","className","host","menuItemSlot","consumeMethodSlot","useComponent","path","useComponentFilters","idFromLocation","useIdFromLocation","_componentIdStr","componentId","ComponentID","fromString","undefined","resolvedComponentIdStr","toStringWithoutVersion","useComponentOptions","logFilters","customUseComponent","component","useComponentQuery","toString","mainMenuItems","useMemo","groupBy","flatten","values","classnames","styles","topBar","leftSide","rightSide","widgets","VersionRelatedDropdowns","consumeMethods","location","useLocation","lanesModel","useLanes","currentLane","viewedLane","id","isDefault","logs","isWorkspace","snaps","filter","log","tag","map","snap","version","hash","reverse","tags","tagLookup","Map","forEach","set","compact","toArray","get","isNew","length","lanes","getLanesByComponentId","lane","localVersion","currentVersion","search","includes","methods","useConsumeMethods","useBox","name","latest","componentVersionMenu","componentModel","method","x","Component","Title"],"sources":["menu.tsx"],"sourcesContent":["import { Routes, Route } from 'react-router-dom';\nimport { MainDropdown, MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';\nimport { VersionDropdown } from '@teambit/component.ui.version-dropdown';\nimport { FullLoader } from '@teambit/ui-foundation.ui.full-loader';\nimport type { ConsumeMethod } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { useLocation } from '@teambit/base-react.navigation.link';\nimport { flatten, groupBy, compact, isFunction } from 'lodash';\nimport classnames from 'classnames';\nimport React, { useMemo } from 'react';\nimport { UseBoxDropdown } from '@teambit/ui-foundation.ui.use-box.dropdown';\nimport { useLanes } from '@teambit/lanes.hooks.use-lanes';\nimport { LaneModel } from '@teambit/lanes.ui.models.lanes-model';\nimport { Menu as ConsumeMethodsMenu } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { LegacyComponentLog } from '@teambit/legacy-component-log';\nimport type { ComponentModel } from '../component-model';\nimport { useComponent as useComponentQuery, UseComponentType } from '../use-component';\nimport { MenuNav } from './menu-nav';\nimport { MobileMenuNav } from './mobile-menu-nav';\nimport styles from './menu.module.scss';\nimport { OrderedNavigationSlot, ConsumeMethodSlot } from './nav-plugin';\nimport { useIdFromLocation } from '../use-component-from-location';\nimport { ComponentID } from '../..';\nimport { Filters } from '../use-component-query';\n\nexport type MenuProps = {\n  className?: string;\n  /**\n   * slot for top bar menu nav items\n   */\n  navigationSlot: OrderedNavigationSlot;\n  /**\n   * right side menu item slot\n   */\n  widgetSlot: OrderedNavigationSlot;\n  host: string;\n  /**\n   * main dropdown item slot\n   */\n  menuItemSlot: MenuItemSlot;\n\n  consumeMethodSlot: ConsumeMethodSlot;\n\n  componentIdStr?: string | (() => string | undefined);\n\n  useComponent?: UseComponentType;\n\n  path?: string,\n\n  useComponentFilters?: (componentId?: ComponentID) => Filters;\n};\nfunction getComponentIdStr(componentIdStr?: string | (() => string | undefined)): string | undefined {\n  if (isFunction(componentIdStr)) return componentIdStr();\n  return componentIdStr;\n}\n/**\n * top bar menu.\n */\nexport function ComponentMenu({\n  navigationSlot,\n  widgetSlot,\n  className,\n  host,\n  menuItemSlot,\n  consumeMethodSlot,\n  componentIdStr,\n  useComponent,\n  path,\n  useComponentFilters,\n}: MenuProps) {\n  const idFromLocation = useIdFromLocation();\n  const _componentIdStr = getComponentIdStr(componentIdStr);\n  const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;\n  const resolvedComponentIdStr = path || componentId?.toStringWithoutVersion() || idFromLocation;\n\n  const useComponentOptions = {\n    logFilters: useComponentFilters?.(componentId),\n    customUseComponent: useComponent,\n  };\n\n  const { component } = useComponentQuery(host, componentId?.toString() || idFromLocation, useComponentOptions);\n  const mainMenuItems = useMemo(() => groupBy(flatten(menuItemSlot.values()), 'category'), [menuItemSlot]);\n  if (!component) return <FullLoader />;\n  return (\n    <Routes>\n      <Route\n        path={`${resolvedComponentIdStr}/*`}\n        element={\n          <div className={classnames(styles.topBar, className)}>\n            <div className={styles.leftSide}>\n              <MenuNav navigationSlot={navigationSlot} />\n              <MobileMenuNav navigationSlot={navigationSlot} widgetSlot={widgetSlot} />\n            </div>\n            <div className={styles.rightSide}>\n              <div className={styles.widgets}>\n                <MenuNav navigationSlot={widgetSlot} />\n              </div>\n              <VersionRelatedDropdowns component={component} consumeMethods={consumeMethodSlot} host={host} />\n              <MainDropdown menuItems={mainMenuItems} />\n            </div>\n          </div>\n        }\n      />\n    </Routes>\n  );\n}\n\nfunction VersionRelatedDropdowns({\n  component,\n  consumeMethods,\n  host,\n}: {\n  component: ComponentModel;\n  consumeMethods: ConsumeMethodSlot;\n  host: string;\n}) {\n  const location = useLocation();\n  const { lanesModel } = useLanes();\n  const currentLane =\n    lanesModel?.viewedLane?.id && !lanesModel?.viewedLane?.id.isDefault() ? lanesModel.viewedLane : undefined;\n\n  const { logs } = component;\n  const isWorkspace = host === 'teambit.workspace/workspace';\n\n  const snaps = useMemo(() => {\n    return (logs || [])\n      .filter((log) => !log.tag)\n      .map((snap) => ({ ...snap, version: snap.hash }))\n      .reverse();\n  }, [logs]);\n\n  const tags = useMemo(() => {\n    const tagLookup = new Map<string, LegacyComponentLog>();\n    (logs || [])\n      .filter((log) => log.tag)\n      .forEach((tag) => {\n        tagLookup.set(tag?.tag as string, tag);\n      });\n    return compact(\n      component.tags\n        ?.toArray()\n        .reverse()\n        .map((tag) => tagLookup.get(tag.version.version))\n    ).map((tag) => ({ ...tag, version: tag.tag as string }));\n  }, [logs]);\n\n  const isNew = snaps.length === 0 && tags.length === 0;\n\n  const lanes = lanesModel?.getLanesByComponentId(component.id)?.filter((lane) => !lane.id.isDefault()) || [];\n  const localVersion = isWorkspace && !isNew && !currentLane;\n\n  const currentVersion =\n    isWorkspace && !isNew && !location?.search.includes('version') ? 'workspace' : component.version;\n\n  const methods = useConsumeMethods(consumeMethods, component, currentLane);\n  return (\n    <>\n      {tags.length > 0 && (\n        <UseBoxDropdown\n          position=\"bottom-end\"\n          className={styles.useBox}\n          Menu={<ConsumeMethodsMenu methods={methods} componentName={component.id.name} />}\n        />\n      )}\n      <VersionDropdown\n        tags={tags}\n        snaps={snaps}\n        lanes={lanes}\n        localVersion={localVersion}\n        currentVersion={currentVersion}\n        latestVersion={component.latest}\n        currentLane={currentLane}\n        menuClassName={styles.componentVersionMenu}\n      />\n    </>\n  );\n}\n\nfunction useConsumeMethods(\n  consumeMethods: ConsumeMethodSlot,\n  componentModel: ComponentModel,\n  currentLane?: LaneModel\n): ConsumeMethod[] {\n  return useMemo(\n    () =>\n      flatten(consumeMethods.values())\n        .map((method) => {\n          return method?.(componentModel, { currentLane });\n        })\n        .filter((x) => !!x && x.Component && x.Title) as ConsumeMethod[],\n    [consumeMethods, componentModel, currentLane]\n  );\n}\n"],"mappings":"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"}
+{"version":3,"names":["getComponentIdStr","componentIdStr","isFunction","ComponentMenu","navigationSlot","widgetSlot","className","host","menuItemSlot","consumeMethodSlot","useComponent","path","useComponentFilters","idFromLocation","useIdFromLocation","_componentIdStr","componentId","ComponentID","fromString","undefined","resolvedComponentIdStr","useComponentOptions","logFilters","customUseComponent","component","useComponentQuery","toString","mainMenuItems","useMemo","groupBy","flatten","values","classnames","styles","topBar","leftSide","rightSide","widgets","VersionRelatedDropdowns","consumeMethods","location","useLocation","lanesModel","useLanes","currentLane","viewedLane","id","isDefault","logs","isWorkspace","snaps","filter","log","tag","map","snap","version","hash","tags","tagLookup","Map","forEach","set","compact","toArray","reverse","get","isNew","length","lanes","getLanesByComponentId","lane","localVersion","currentVersion","search","includes","methods","useConsumeMethods","useBox","name","latest","componentVersionMenu","componentModel","method","x","Component","Title"],"sources":["menu.tsx"],"sourcesContent":["import { Routes, Route } from 'react-router-dom';\nimport { MainDropdown, MenuItemSlot } from '@teambit/ui-foundation.ui.main-dropdown';\nimport { VersionDropdown } from '@teambit/component.ui.version-dropdown';\nimport { FullLoader } from '@teambit/ui-foundation.ui.full-loader';\nimport type { ConsumeMethod } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { useLocation } from '@teambit/base-react.navigation.link';\nimport { flatten, groupBy, compact, isFunction } from 'lodash';\nimport classnames from 'classnames';\nimport React, { useMemo } from 'react';\nimport { UseBoxDropdown } from '@teambit/ui-foundation.ui.use-box.dropdown';\nimport { useLanes } from '@teambit/lanes.hooks.use-lanes';\nimport { LaneModel } from '@teambit/lanes.ui.models.lanes-model';\nimport { Menu as ConsumeMethodsMenu } from '@teambit/ui-foundation.ui.use-box.menu';\nimport { LegacyComponentLog } from '@teambit/legacy-component-log';\nimport type { ComponentModel } from '../component-model';\nimport { useComponent as useComponentQuery, UseComponentType } from '../use-component';\nimport { MenuNav } from './menu-nav';\nimport { MobileMenuNav } from './mobile-menu-nav';\nimport styles from './menu.module.scss';\nimport { OrderedNavigationSlot, ConsumeMethodSlot } from './nav-plugin';\nimport { useIdFromLocation } from '../use-component-from-location';\nimport { ComponentID } from '../..';\nimport { Filters } from '../use-component-query';\n\nexport type MenuProps = {\n  className?: string;\n  /**\n   * slot for top bar menu nav items\n   */\n  navigationSlot: OrderedNavigationSlot;\n  /**\n   * right side menu item slot\n   */\n  widgetSlot: OrderedNavigationSlot;\n  host: string;\n  /**\n   * main dropdown item slot\n   */\n  menuItemSlot: MenuItemSlot;\n\n  consumeMethodSlot: ConsumeMethodSlot;\n\n  componentIdStr?: string | (() => string | undefined);\n\n  useComponent?: UseComponentType;\n\n  path?: string;\n\n  useComponentFilters?: () => Filters;\n};\nfunction getComponentIdStr(componentIdStr?: string | (() => string | undefined)): string | undefined {\n  if (isFunction(componentIdStr)) return componentIdStr();\n  return componentIdStr;\n}\n/**\n * top bar menu.\n */\nexport function ComponentMenu({\n  navigationSlot,\n  widgetSlot,\n  className,\n  host,\n  menuItemSlot,\n  consumeMethodSlot,\n  componentIdStr,\n  useComponent,\n  path,\n  useComponentFilters,\n}: MenuProps) {\n  const idFromLocation = useIdFromLocation();\n  const _componentIdStr = getComponentIdStr(componentIdStr);\n  const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;\n  const resolvedComponentIdStr = path || idFromLocation;\n\n  const useComponentOptions = {\n    logFilters: useComponentFilters?.(),\n    customUseComponent: useComponent,\n  };\n\n  const { component } = useComponentQuery(host, componentId?.toString() || idFromLocation, useComponentOptions);\n  const mainMenuItems = useMemo(() => groupBy(flatten(menuItemSlot.values()), 'category'), [menuItemSlot]);\n  if (!component) return <FullLoader />;\n  return (\n    <Routes>\n      <Route\n        path={`${resolvedComponentIdStr}/*`}\n        element={\n          <div className={classnames(styles.topBar, className)}>\n            <div className={styles.leftSide}>\n              <MenuNav navigationSlot={navigationSlot} />\n              <MobileMenuNav navigationSlot={navigationSlot} widgetSlot={widgetSlot} />\n            </div>\n            <div className={styles.rightSide}>\n              <div className={styles.widgets}>\n                <MenuNav navigationSlot={widgetSlot} />\n              </div>\n              <VersionRelatedDropdowns component={component} consumeMethods={consumeMethodSlot} host={host} />\n              <MainDropdown menuItems={mainMenuItems} />\n            </div>\n          </div>\n        }\n      />\n    </Routes>\n  );\n}\n\nfunction VersionRelatedDropdowns({\n  component,\n  consumeMethods,\n  host,\n}: {\n  component: ComponentModel;\n  consumeMethods: ConsumeMethodSlot;\n  host: string;\n}) {\n  const location = useLocation();\n  const { lanesModel } = useLanes();\n  const currentLane =\n    lanesModel?.viewedLane?.id && !lanesModel?.viewedLane?.id.isDefault() ? lanesModel.viewedLane : undefined;\n\n  const { logs } = component;\n  const isWorkspace = host === 'teambit.workspace/workspace';\n\n  const snaps = useMemo(() => {\n    return (logs || []).filter((log) => !log.tag).map((snap) => ({ ...snap, version: snap.hash }));\n  }, [logs]);\n\n  const tags = useMemo(() => {\n    const tagLookup = new Map<string, LegacyComponentLog>();\n    (logs || [])\n      .filter((log) => log.tag)\n      .forEach((tag) => {\n        tagLookup.set(tag?.tag as string, tag);\n      });\n    return compact(\n      component.tags\n        ?.toArray()\n        .reverse()\n        .map((tag) => tagLookup.get(tag.version.version))\n    ).map((tag) => ({ ...tag, version: tag.tag as string }));\n  }, [logs]);\n\n  const isNew = snaps.length === 0 && tags.length === 0;\n\n  const lanes = lanesModel?.getLanesByComponentId(component.id)?.filter((lane) => !lane.id.isDefault()) || [];\n  const localVersion = isWorkspace && !isNew && !currentLane;\n\n  const currentVersion =\n    isWorkspace && !isNew && !location?.search.includes('version') ? 'workspace' : component.version;\n\n  const methods = useConsumeMethods(consumeMethods, component, currentLane);\n  return (\n    <>\n      {tags.length > 0 && (\n        <UseBoxDropdown\n          position=\"bottom-end\"\n          className={styles.useBox}\n          Menu={<ConsumeMethodsMenu methods={methods} componentName={component.id.name} />}\n        />\n      )}\n      <VersionDropdown\n        tags={tags}\n        snaps={snaps}\n        lanes={lanes}\n        localVersion={localVersion}\n        currentVersion={currentVersion}\n        latestVersion={component.latest}\n        currentLane={currentLane}\n        menuClassName={styles.componentVersionMenu}\n      />\n    </>\n  );\n}\n\nfunction useConsumeMethods(\n  consumeMethods: ConsumeMethodSlot,\n  componentModel: ComponentModel,\n  currentLane?: LaneModel\n): ConsumeMethod[] {\n  return useMemo(\n    () =>\n      flatten(consumeMethods.values())\n        .map((method) => {\n          return method?.(componentModel, { currentLane });\n        })\n        .filter((x) => !!x && x.Component && x.Title) as ConsumeMethod[],\n    [consumeMethods, componentModel, currentLane]\n  );\n}\n"],"mappings":"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"}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/component",
-  "version": "0.0.876",
+  "version": "0.0.878",
   "homepage": "https://bit.dev/teambit/component/component",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.component",
     "name": "component",
-    "version": "0.0.876"
+    "version": "0.0.878"
   },
   "dependencies": {
     "@teambit/any-fs": "0.0.5",
@@ -29,44 +29,44 @@
     "@teambit/base-ui.layout.breakpoints": "1.0.0",
     "@teambit/design.elements.icon": "1.0.5",
     "@teambit/design.inputs.dropdown": "0.0.7",
-    "@teambit/component-id": "0.0.417",
+    "@teambit/component-id": "0.0.418",
     "@teambit/ui-foundation.ui.menu-widget-icon": "0.0.494",
-    "@teambit/aspect-loader": "0.0.876",
+    "@teambit/aspect-loader": "0.0.878",
     "@teambit/legacy-bit-id": "0.0.414",
     "@teambit/toolbox.path.match-patterns": "0.0.7",
     "@teambit/toolbox.string.capitalize": "0.0.489",
-    "@teambit/cli": "0.0.586",
-    "@teambit/express": "0.0.684",
-    "@teambit/graphql": "0.0.876",
+    "@teambit/cli": "0.0.588",
+    "@teambit/express": "0.0.686",
+    "@teambit/graphql": "0.0.878",
     "@teambit/bit-error": "0.0.400",
-    "@teambit/command-bar": "0.0.876",
+    "@teambit/command-bar": "0.0.878",
     "@teambit/component.ui.deprecation-icon": "0.0.500",
-    "@teambit/preview": "0.0.876",
-    "@teambit/pubsub": "0.0.876",
-    "@teambit/react-router": "0.0.876",
+    "@teambit/preview": "0.0.878",
+    "@teambit/pubsub": "0.0.878",
+    "@teambit/react-router": "0.0.878",
     "@teambit/ui-foundation.ui.is-browser": "0.0.492",
     "@teambit/ui-foundation.ui.main-dropdown": "0.0.493",
     "@teambit/ui-foundation.ui.react-router.slot-router": "0.0.496",
     "@teambit/ui-foundation.ui.use-box.menu": "0.0.122",
-    "@teambit/ui": "0.0.876",
+    "@teambit/ui": "0.0.878",
     "@teambit/component-issues": "0.0.72",
     "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.496",
     "@teambit/cli-table": "0.0.40",
-    "@teambit/component-descriptor": "0.0.154",
+    "@teambit/component-descriptor": "0.0.156",
     "@teambit/ui-foundation.ui.react-router.use-query": "0.0.493",
     "@teambit/design.ui.empty-box": "0.0.360",
     "@teambit/harmony.ui.aspect-box": "0.0.492",
     "@teambit/design.ui.pages.not-found": "0.0.363",
     "@teambit/design.ui.pages.server-error": "0.0.363",
-    "@teambit/compositions": "0.0.876",
-    "@teambit/deprecation": "0.0.876",
-    "@teambit/envs": "0.0.876",
+    "@teambit/compositions": "0.0.878",
+    "@teambit/deprecation": "0.0.878",
+    "@teambit/envs": "0.0.878",
     "@teambit/legacy-component-log": "0.0.398",
     "@teambit/design.ui.styles.ellipsis": "0.0.353",
     "@teambit/envs.ui.env-icon": "0.0.492",
-    "@teambit/component.ui.version-dropdown": "0.0.648",
-    "@teambit/lanes.hooks.use-lanes": "0.0.46",
-    "@teambit/lanes.ui.models.lanes-model": "0.0.8",
+    "@teambit/component.ui.version-dropdown": "0.0.650",
+    "@teambit/lanes.hooks.use-lanes": "0.0.48",
+    "@teambit/lanes.ui.models.lanes-model": "0.0.10",
     "@teambit/ui-foundation.ui.full-loader": "0.0.492",
     "@teambit/ui-foundation.ui.use-box.dropdown": "0.0.122",
     "@teambit/ui-foundation.ui.constants.z-indexes": "0.0.494"
@@ -88,7 +88,7 @@
   "peerDependencies": {
     "react-router-dom": "^6.0.0",
     "@apollo/client": "^3.6.0",
-    "@teambit/legacy": "1.0.367",
+    "@teambit/legacy": "1.0.369",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },

package/{preview-1665459720186.js → preview-1665718844698.js}

@@ -1,5 +1,5 @@
-import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.876/dist/component.composition.js';
-import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.876/dist/component.docs.mdx';
+import * as compositions_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.878/dist/component.composition.js';
+import * as overview_0 from '/home/circleci/Library/Caches/Bit/capsules/8891be5ad3d35bfc38b9cd90c0e05b598a5a55af/teambit.component_component@0.0.878/dist/component.docs.mdx';
 
 export const compositions = [compositions_0];
 export const overview = [overview_0];

package/ui/component.tsx

@@ -23,7 +23,7 @@ export type ComponentProps = {
   host: string;
   onComponentChange?: (activeComponent?: ComponentModel) => void;
   useComponent?: UseComponentType;
-  useComponentFilters?: (componentId?: ComponentID) => Filters;
+  useComponentFilters?: () => Filters;
   path?: string;
   componentIdStr?: string | (() => string | undefined);
 };
@@ -49,9 +49,9 @@ export function Component({
   const idFromLocation = useIdFromLocation();
   const _componentIdStr = getComponentIdStr(componentIdStr);
   const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;
-  const resolvedComponentIdStr = path || componentId?.toStringWithoutVersion() || idFromLocation;
+  const resolvedComponentIdStr = path || idFromLocation;
   const useComponentOptions = {
-    logFilters: useComponentFilters?.(componentId),
+    logFilters: useComponentFilters?.(),
     customUseComponent: useComponent,
   };
 

package/ui/menu/menu.tsx

@@ -44,9 +44,9 @@ export type MenuProps = {
 
   useComponent?: UseComponentType;
 
-  path?: string,
+  path?: string;
 
-  useComponentFilters?: (componentId?: ComponentID) => Filters;
+  useComponentFilters?: () => Filters;
 };
 function getComponentIdStr(componentIdStr?: string | (() => string | undefined)): string | undefined {
   if (isFunction(componentIdStr)) return componentIdStr();
@@ -70,10 +70,10 @@ export function ComponentMenu({
   const idFromLocation = useIdFromLocation();
   const _componentIdStr = getComponentIdStr(componentIdStr);
   const componentId = _componentIdStr ? ComponentID.fromString(_componentIdStr) : undefined;
-  const resolvedComponentIdStr = path || componentId?.toStringWithoutVersion() || idFromLocation;
+  const resolvedComponentIdStr = path || idFromLocation;
 
   const useComponentOptions = {
-    logFilters: useComponentFilters?.(componentId),
+    logFilters: useComponentFilters?.(),
     customUseComponent: useComponent,
   };
 
@@ -122,10 +122,7 @@ function VersionRelatedDropdowns({
   const isWorkspace = host === 'teambit.workspace/workspace';
 
   const snaps = useMemo(() => {
-    return (logs || [])
-      .filter((log) => !log.tag)
-      .map((snap) => ({ ...snap, version: snap.hash }))
-      .reverse();
+    return (logs || []).filter((log) => !log.tag).map((snap) => ({ ...snap, version: snap.hash }));
   }, [logs]);
 
   const tags = useMemo(() => {