@teambit/code.ui.queries.get-file-content 0.0.505 → 0.0.506

package/dist/get-file-content.d.ts

@@ -1,5 +1,5 @@
-import { ComponentID } from '@teambit/component';
+import type { ComponentID } from '@teambit/component-id';
 export declare function useFileContent(componentId?: ComponentID, filePath?: string, skip?: boolean, host?: string): {
-    fileContent: string;
+    fileContent: any;
     loading: boolean;
 };

package/dist/get-file-content.js

@@ -19,12 +19,39 @@ const getFile = (0, client_1.gql) `
     }
   }
 `;
+const COMPONENT_CHANGED_SUBSCRIPTION = (0, client_1.gql) `
+  subscription OnComponentChangedForFile {
+    componentChanged {
+      component {
+        id {
+          name
+          scope
+        }
+      }
+    }
+  }
+`;
 function useFileContent(componentId, filePath, skip, host) {
     var _a, _b;
     const id = componentId === null || componentId === void 0 ? void 0 : componentId.toString();
-    const { data, loading } = (0, ui_foundation_ui_hooks_use_data_query_1.useDataQuery)(getFile, {
+    const querySkip = skip || !componentId || filePath === undefined;
+    const { data, loading, refetch } = (0, ui_foundation_ui_hooks_use_data_query_1.useDataQuery)(getFile, {
         variables: { id, path: filePath, extensionId: host },
-        skip: skip || !componentId || filePath === undefined,
+        skip: querySkip,
+    });
+    (0, client_1.useSubscription)(COMPONENT_CHANGED_SUBSCRIPTION, {
+        skip: querySkip,
+        onSubscriptionData: ({ subscriptionData }) => {
+            var _a, _b, _c;
+            const changedId = (_c = (_b = (_a = subscriptionData.data) === null || _a === void 0 ? void 0 : _a.componentChanged) === null || _b === void 0 ? void 0 : _b.component) === null || _c === void 0 ? void 0 : _c.id;
+            if (!changedId || !componentId)
+                return;
+            if (changedId.name !== componentId.fullName)
+                return;
+            if (changedId.scope && componentId.scope && changedId.scope !== componentId.scope)
+                return;
+            refetch();
+        },
     });
     const fileContent = (_b = (_a = data === null || data === void 0 ? void 0 : data.getHost) === null || _a === void 0 ? void 0 : _a.get) === null || _b === void 0 ? void 0 : _b.getFile;
     return { fileContent, loading };

package/dist/get-file-content.js.map

@@ -1 +1 @@
-{"version":3,"file":"get-file-content.js","sourceRoot":"","sources":["../get-file-content.ts"],"names":[],"mappings":";;AAmCA,wCAgBC;AAnDD,2CAAqC;AACrC,0GAA8E;AAG9E,MAAM,OAAO,GAAG,IAAA,YAAG,EAAA;;;;;;;;;;;;;;;CAelB,CAAC;AAgBF,SAAgB,cAAc,CAC5B,WAAyB,EACzB,QAAiB,EACjB,IAAc,EACd,IAAa;;IAEb,MAAM,EAAE,GAAI,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,QAAQ,EAAE,CAAC;IAEpC,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,IAAA,oDAAY,EAAa,OAAO,EAAE;QAC1D,SAAS,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAG;QACrD,IAAI,EAAE,IAAI,IAAI,CAAC,WAAW,IAAI,QAAQ,KAAK,SAAS;KACrD,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,0CAAE,GAAG,0CAAE,OAAO,CAAC;IAEhD,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC;AAClC,CAAC"}
+{"version":3,"file":"get-file-content.js","sourceRoot":"","sources":["../get-file-content.ts"],"names":[],"mappings":";;AAwDA,wCAuBC;AA/ED,2CAAsD;AACtD,0GAA8E;AAG9E,MAAM,OAAO,GAAG,IAAA,YAAG,EAAA;;;;;;;;;;;;;;;CAelB,CAAC;AAEF,MAAM,8BAA8B,GAAG,IAAA,YAAG,EAAA;;;;;;;;;;;CAWzC,CAAC;AAwBF,SAAgB,cAAc,CAAC,WAAyB,EAAE,QAAiB,EAAE,IAAc,EAAE,IAAa;;IACxG,MAAM,EAAE,GAAG,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,QAAQ,EAAE,CAAC;IACnC,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,WAAW,IAAI,QAAQ,KAAK,SAAS,CAAC;IAEjE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,IAAA,oDAAY,EAAa,OAAO,EAAE;QACnE,SAAS,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE;QACpD,IAAI,EAAE,SAAS;KAChB,CAAC,CAAC;IAEH,IAAA,wBAAe,EAA0B,8BAA8B,EAAE;QACvE,IAAI,EAAE,SAAS;QACf,kBAAkB,EAAE,CAAC,EAAE,gBAAgB,EAAE,EAAE,EAAE;;YAC3C,MAAM,SAAS,GAAG,MAAA,MAAA,MAAA,gBAAgB,CAAC,IAAI,0CAAE,gBAAgB,0CAAE,SAAS,0CAAE,EAAE,CAAC;YACzE,IAAI,CAAC,SAAS,IAAI,CAAC,WAAW;gBAAE,OAAO;YACvC,IAAI,SAAS,CAAC,IAAI,KAAK,WAAW,CAAC,QAAQ;gBAAE,OAAO;YACpD,IAAI,SAAS,CAAC,KAAK,IAAI,WAAW,CAAC,KAAK,IAAI,SAAS,CAAC,KAAK,KAAK,WAAW,CAAC,KAAK;gBAAE,OAAO;YAC1F,OAAO,EAAE,CAAC;QACZ,CAAC;KACF,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,MAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,OAAO,0CAAE,GAAG,0CAAE,OAAO,CAAC;IAEhD,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC;AAClC,CAAC"}

package/dist/preview-1778686821215.js

@@ -0,0 +1,7 @@
+;
+;
+
+export const compositions = [];
+export const overview = [];
+
+export const compositions_metadata = {"compositions":[]};

package/get-file-content.ts

@@ -1,6 +1,6 @@
-import { gql } from '@apollo/client';
+import { gql, useSubscription } from '@apollo/client';
 import { useDataQuery } from '@teambit/ui-foundation.ui.hooks.use-data-query';
-import { ComponentID } from '@teambit/component';
+import type { ComponentID } from '@teambit/component-id';
 
 const getFile = gql`
   query getFile($id: String!, $extensionId: String, $path: String) {
@@ -19,6 +19,19 @@ const getFile = gql`
   }
 `;
 
+const COMPONENT_CHANGED_SUBSCRIPTION = gql`
+  subscription OnComponentChangedForFile {
+    componentChanged {
+      component {
+        id {
+          name
+          scope
+        }
+      }
+    }
+  }
+`;
+
 type FileResult = {
   getHost: {
     id: string;
@@ -33,17 +46,32 @@ type FileResult = {
   };
 };
 
-export function useFileContent(
-  componentId?: ComponentID, 
-  filePath?: string, 
-  skip?: boolean, 
-  host?: string,
-) {
-  const id =  componentId?.toString();
-
-  const { data, loading } = useDataQuery<FileResult>(getFile, {
-    variables: { id, path: filePath, extensionId: host  },
-    skip: skip || !componentId || filePath === undefined,
+type ComponentChangedSubData = {
+  componentChanged?: {
+    component?: {
+      id: { name: string; scope: string };
+    };
+  };
+};
+
+export function useFileContent(componentId?: ComponentID, filePath?: string, skip?: boolean, host?: string) {
+  const id = componentId?.toString();
+  const querySkip = skip || !componentId || filePath === undefined;
+
+  const { data, loading, refetch } = useDataQuery<FileResult>(getFile, {
+    variables: { id, path: filePath, extensionId: host },
+    skip: querySkip,
+  });
+
+  useSubscription<ComponentChangedSubData>(COMPONENT_CHANGED_SUBSCRIPTION, {
+    skip: querySkip,
+    onSubscriptionData: ({ subscriptionData }) => {
+      const changedId = subscriptionData.data?.componentChanged?.component?.id;
+      if (!changedId || !componentId) return;
+      if (changedId.name !== componentId.fullName) return;
+      if (changedId.scope && componentId.scope && changedId.scope !== componentId.scope) return;
+      refetch();
+    },
   });
 
   const fileContent = data?.getHost?.get?.getFile;

package/package.json

@@ -1,16 +1,17 @@
 {
   "name": "@teambit/code.ui.queries.get-file-content",
-  "version": "0.0.505",
+  "version": "0.0.506",
   "homepage": "https://bit.cloud/teambit/code/ui/queries/get-file-content",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.code",
     "name": "ui/queries/get-file-content",
-    "version": "0.0.505"
+    "version": "0.0.506"
   },
   "dependencies": {
     "core-js": "^3.0.0",
-    "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.500"
+    "@teambit/component-id": "1.2.4",
+    "@teambit/ui-foundation.ui.hooks.use-data-query": "0.0.506"
   },
   "devDependencies": {
     "@types/mocha": "9.1.0",

package/types/asset.d.ts

@@ -0,0 +1,29 @@
+declare module '*.png' {
+  const value: any;
+  export = value;
+}
+declare module '*.svg' {
+  import type { FunctionComponent, SVGProps } from 'react';
+
+  export const ReactComponent: FunctionComponent<SVGProps<SVGSVGElement> & { title?: string }>;
+  const src: string;
+  export default src;
+}
+
+// @TODO Gilad
+declare module '*.jpg' {
+  const value: any;
+  export = value;
+}
+declare module '*.jpeg' {
+  const value: any;
+  export = value;
+}
+declare module '*.gif' {
+  const value: any;
+  export = value;
+}
+declare module '*.bmp' {
+  const value: any;
+  export = value;
+}

package/types/style.d.ts

@@ -0,0 +1,42 @@
+declare module '*.module.css' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+declare module '*.module.scss' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+declare module '*.module.sass' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.module.less' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.less' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.css' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.sass' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.scss' {
+  const classes: { readonly [key: string]: string };
+  export default classes;
+}
+
+declare module '*.mdx' {
+  const component: any;
+  export default component;
+}