@teambit/component 0.0.651 → 0.0.652

package/{__preview-1645365357220.js → __preview-1645372601675.js}

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

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

@@ -288,10 +288,10 @@ function useComponentQuery(componentId, host) {
       }))
     };
 
-    const id = _componentId().ComponentID.fromObject(rawComponent.id);
+    const id = rawComponent && _componentId().ComponentID.fromObject(rawComponent.id);
 
     return {
-      componentDescriptor: rawComponent ? _componentDescriptor().ComponentDescriptor.fromObject({
+      componentDescriptor: id ? _componentDescriptor().ComponentDescriptor.fromObject({
         id: id.toString(),
         aspectList
       }) : 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","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 = ComponentID.fromObject(rawComponent.id);\n    return {\n      componentDescriptor: rawComponent ? 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"]}
+{"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/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/component",
-  "version": "0.0.651",
+  "version": "0.0.652",
   "homepage": "https://bit.dev/teambit/component/component",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.component",
     "name": "component",
-    "version": "0.0.651"
+    "version": "0.0.652"
   },
   "dependencies": {
     "@teambit/any-fs": "0.0.5",
@@ -29,22 +29,22 @@
     "@teambit/base-ui.routing.routing-provider": "1.0.0",
     "@teambit/component-id": "0.0.401",
     "@teambit/ui-foundation.ui.menu-widget-icon": "0.0.488",
-    "@teambit/aspect-loader": "0.0.651",
+    "@teambit/aspect-loader": "0.0.652",
     "@teambit/legacy-bit-id": "0.0.398",
     "@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.651",
+    "@teambit/graphql": "0.0.652",
     "@teambit/bit-error": "0.0.394",
-    "@teambit/command-bar": "0.0.651",
-    "@teambit/preview": "0.0.651",
-    "@teambit/pubsub": "0.0.651",
+    "@teambit/command-bar": "0.0.652",
+    "@teambit/preview": "0.0.652",
+    "@teambit/pubsub": "0.0.652",
     "@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.651",
+    "@teambit/ui": "0.0.652",
     "@teambit/component-issues": "0.0.46",
     "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.487",
     "@teambit/cli-table": "0.0.33",
@@ -54,9 +54,9 @@
     "@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.651",
-    "@teambit/deprecation": "0.0.651",
-    "@teambit/envs": "0.0.651",
+    "@teambit/compositions": "0.0.652",
+    "@teambit/deprecation": "0.0.652",
+    "@teambit/envs": "0.0.652",
     "@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"

package/ui/use-component-query.ts

@@ -196,9 +196,9 @@ export function useComponentQuery(componentId: string, host: string) {
     const aspectList = {
       entries: rawComponent?.aspects?.map((aspect) => ({ aspectId: aspect.id, aspectData: aspect.data })),
     };
-    const id = ComponentID.fromObject(rawComponent.id);
+    const id = rawComponent && ComponentID.fromObject(rawComponent.id);
     return {
-      componentDescriptor: rawComponent ? ComponentDescriptor.fromObject({ id: id.toString(), aspectList }) : undefined,
+      componentDescriptor: id ? ComponentDescriptor.fromObject({ id: id.toString(), aspectList }) : undefined,
       component: rawComponent ? ComponentModel.from({ ...rawComponent, host }) : undefined,
       // eslint-disable-next-line
       error: error