WIP

packages/gephi-lite/src/core/Initialize.tsx

@@ -8,7 +8,7 @@ import { extractFilename } from "../utils/url";
 import { WelcomeModal } from "../views/graphPage/modals/WelcomeModal";
 import { appearanceAtom } from "./appearance";
 import { useBroadcast } from "./broadcast/useBroadcast";
-import { useGraphDatasetActions, useImportActions } from "./context/dataContexts";
+import { useFileActions, useGraphDatasetActions } from "./context/dataContexts";
 import { filtersAtom } from "./filters";
 import { parseFiltersState } from "./filters/utils";
 import { graphDatasetAtom } from "./graph";
@@ -31,7 +31,7 @@ export const Initialize: FC<PropsWithChildren<unknown>> = ({ children }) => {
   const { t } = useTranslation();
   const { notify } = useNotifications();
   const { openModal } = useModal();
-  const { importFile } = useImportActions();
+  const { open } = useFileActions();
   const { resetGraph } = useGraphDatasetActions();
   const [broadcastID, setBroadcastID] = useState<string | null>(null);
   useBroadcast(broadcastID);
@@ -107,7 +107,7 @@ export const Initialize: FC<PropsWithChildren<unknown>> = ({ children }) => {
       const file = url.searchParams.get("file") || url.searchParams.get("gexf") || "";
 
       try {
-        await importFile({
+        await open({
           type: "remote",
           filename: extractFilename(file),
           url: file,

packages/gephi-lite/src/core/broadcast/actions.ts

@@ -0,0 +1,45 @@
+import { Producer, asyncAction, producerToAction } from "@ouestware/atoms";
+import Graph from "graphology";
+import { SerializedGraph } from "graphology-types";
+
+import { appearanceAtom } from "../appearance";
+import { AppearanceState } from "../appearance/types";
+import { resetStates } from "../context/dataContexts";
+import { fileAtom } from "../file";
+import { graphDatasetActions } from "../graph";
+import { initializeGraphDataset } from "../graph/utils";
+import { resetCamera } from "../sigma";
+
+/**
+ * Actions:
+ * ********
+ */
+// TODO: this code has a lot in commons with core/file/index.ts/open
+// we should mutialize it
+const importGraph = asyncAction(async (data: SerializedGraph, title?: string) => {
+  if (fileAtom.get().status.type === "loading") throw new Error("A file is already being loaded");
+  fileAtom.set((prev) => ({ ...prev, status: { type: "loading" } }));
+  try {
+    const graph = Graph.from(data);
+    if (title) graph.setAttribute("title", title);
+
+    const { setGraphDataset } = graphDatasetActions;
+    resetStates(false);
+    setGraphDataset({ ...initializeGraphDataset(graph) });
+    resetCamera({ forceRefresh: true });
+  } catch (e) {
+    fileAtom.set((prev) => ({ ...prev, status: { type: "error", message: (e as Error).message } }));
+    throw e;
+  } finally {
+    fileAtom.set((prev) => ({ ...prev, status: { type: "idle" } }));
+  }
+});
+
+const updateAppearance: Producer<AppearanceState, [Partial<AppearanceState>]> = (newState) => {
+  return (state) => ({ ...state, ...newState });
+};
+
+export const broadcastActions = {
+  importGraph,
+  updateAppearance: producerToAction(updateAppearance, appearanceAtom),
+};

packages/gephi-lite/src/core/broadcast/client.ts

@@ -18,10 +18,10 @@ import { assert } from "typia";
 import { config } from "../../config";
 import { appearanceAtom } from "../appearance";
 import { resetStates } from "../context/dataContexts";
+import { fileAtom } from "../file";
 import { filtersAtom } from "../filters";
 import { FiltersState } from "../filters/types";
 import { graphDatasetActions, graphDatasetAtom } from "../graph";
-import { importStateAtom } from "../graph/import";
 import { dataGraphToFullGraph, initializeGraphDataset } from "../graph/utils";
 import { resetCamera } from "../sigma";
 
@@ -42,21 +42,20 @@ const BROADCAST_METHODS: {
     return config.version;
   },
   importGraph: async (data) => {
-    if (importStateAtom.get().type === "loading") throw new Error("A file is already being loaded");
-    importStateAtom.set({ type: "loading" });
+    if (fileAtom.get().status.type === "loading") throw new Error("A file is already being loaded");
+    fileAtom.set((prev) => ({ ...prev, status: { type: "loading" } }));
 
     try {
       const graph = Graph.from(data);
-
       const { setGraphDataset } = graphDatasetActions;
       resetStates(false);
       setGraphDataset({ ...initializeGraphDataset(graph) });
       resetCamera({ forceRefresh: true });
     } catch (e) {
-      importStateAtom.set({ type: "error", message: (e as Error).message });
+      fileAtom.set((prev) => ({ ...prev, status: { type: "error", message: (e as Error).message } }));
       throw e;
     } finally {
-      importStateAtom.set({ type: "idle" });
+      fileAtom.set((prev) => ({ ...prev, status: { type: "idle" } }));
     }
   },
   getGraph: async () => {

packages/gephi-lite/src/core/cloud/types.ts

@@ -1,6 +1,6 @@
-import { GraphFile } from "../graph/import/types";
+import { AbstractFile } from "../file/types";
 
-export interface CloudFile extends GraphFile {
+export interface CloudFile extends AbstractFile {
   type: "cloud";
   id: string;
   description?: string;

packages/gephi-lite/src/core/cloud/useCloudProvider.ts

@@ -1,18 +1,15 @@
-import { useAtom } from "@ouestware/atoms";
 import { isNil } from "lodash";
 import { useCallback, useState } from "react";
 
-import { useExportActions, useImportActions } from "../context/dataContexts";
-import { originAtom } from "../graph";
+import { useFile, useFileActions } from "../context/dataContexts";
 import { useConnectedUser } from "../user";
 import { CloudFile } from "./types";
 
 // TODO: need to be refacto by atom/action/producer pattern
 export function useCloudProvider() {
   const [user] = useConnectedUser();
-  const [origin, setOrigin] = useAtom(originAtom);
-  const { exportAsGexf } = useExportActions();
-  const { importFile } = useImportActions();
+  const { current: currentFile } = useFile();
+  const { open, exportAsGexf, setCurrentFile } = useFileActions();
 
   const [loading, setLoading] = useState<boolean>(false);
   const [error, setError] = useState<Error | null>(null);
@@ -41,15 +38,15 @@ export function useCloudProvider() {
       setLoading(true);
       setError(null);
       try {
-        await importFile(file);
+        await open(file);
       } catch (e) {
         setError(e as Error);
         throw e;
       } finally {
         setLoading(false);
       }
     },
-    [importFile],
+    [open],
   );
 
   /**
@@ -60,17 +57,17 @@ export function useCloudProvider() {
     setError(null);
     try {
       if (isNil(user)) throw new Error("You must be logged !");
-      if (!origin || origin.type !== "cloud") throw new Error("Not a cloud graph");
+      if (!currentFile || currentFile.type !== "cloud") throw new Error("Not a cloud graph");
       await exportAsGexf(async (content) => {
-        await user.provider.saveFile(origin as CloudFile, content);
+        await user.provider.saveFile(currentFile as CloudFile, content);
       });
     } catch (e) {
       setError(e as Error);
       throw e;
     } finally {
       setLoading(false);
     }
-  }, [user, exportAsGexf, origin]);
+  }, [user, exportAsGexf, currentFile]);
 
   /**
    * Save the current graph in the provider.
@@ -83,7 +80,7 @@ export function useCloudProvider() {
         if (isNil(user)) throw new Error("You must be logged !");
         await exportAsGexf(async (content) => {
           const result = await user.provider.createFile(file, content);
-          setOrigin(result);
+          setCurrentFile(result);
         });
       } catch (e) {
         setError(e as Error);
@@ -92,7 +89,7 @@ export function useCloudProvider() {
         setLoading(false);
       }
     },
-    [user, exportAsGexf, setOrigin],
+    [user, exportAsGexf, setCurrentFile],
   );
 
   return { loading, error, getFiles, openFile, saveFile, createFile };

packages/gephi-lite/src/core/context/dataContexts.tsx

@@ -3,17 +3,9 @@ import { reduce } from "lodash";
 import { Context, FC, ReactNode, createContext, useContext } from "react";
 
 import { appearanceActions, appearanceAtom } from "../appearance";
+import { fileActions, fileAtom } from "../file";
 import { filtersActions, filtersAtom } from "../filters";
-import {
-  filteredGraphAtom,
-  graphDatasetActions,
-  graphDatasetAtom,
-  originAtom,
-  sigmaGraphAtom,
-  visualGettersAtom,
-} from "../graph";
-import { exportActions, exportStateAtom } from "../graph/export";
-import { importActions, importStateAtom } from "../graph/import";
+import { filteredGraphAtom, graphDatasetActions, graphDatasetAtom, sigmaGraphAtom, visualGettersAtom } from "../graph";
 import { layoutActions, layoutStateAtom } from "../layouts";
 import { preferencesActions, preferencesAtom } from "../preferences";
 import { searchActions, searchAtom } from "../search";
@@ -50,8 +42,7 @@ const ATOMS = {
   sigma: sigmaAtom,
   filters: filtersAtom,
   selection: selectionAtom,
-  importState: importStateAtom,
-  exportState: exportStateAtom,
+  file: fileAtom,
   appearance: appearanceAtom,
   sigmaState: sigmaStateAtom,
   sigmaGraph: sigmaGraphAtom,
@@ -62,7 +53,6 @@ const ATOMS = {
   search: searchAtom,
   layoutState: layoutStateAtom,
   session: sessionAtom,
-  origin: originAtom,
   user: userAtom,
 };
 type AtomName = keyof typeof ATOMS;
@@ -72,8 +62,7 @@ const CONTEXTS = {
   filters: createContext(ATOMS.filters),
   filteredGraph: createContext(ATOMS.filteredGraph),
   graphDataset: createContext(ATOMS.graphDataset),
-  exportState: createContext(ATOMS.exportState),
-  importState: createContext(ATOMS.importState),
+  file: createContext(ATOMS.file),
   visualGetters: createContext(ATOMS.visualGetters),
   layoutState: createContext(ATOMS.layoutState),
   preferences: createContext(ATOMS.preferences),
@@ -83,7 +72,6 @@ const CONTEXTS = {
   sigma: createContext(ATOMS.sigma),
   sigmaState: createContext(ATOMS.sigmaState),
   sigmaGraph: createContext(ATOMS.sigmaGraph),
-  origin: createContext(ATOMS.origin),
   user: createContext(ATOMS.user),
 };
 
@@ -116,6 +104,7 @@ export const resetStates: Action<[boolean]> = (full = false) => {
   sigmaActions.resetState();
   searchActions.reset();
   graphDatasetActions.resetGraph();
+  fileActions.reset();
 
   if (full) {
     userActions.reset();
@@ -127,8 +116,7 @@ export const resetStates: Action<[boolean]> = (full = false) => {
 export const useFilters = makeUseAtom(CONTEXTS.filters);
 export const useSigmaAtom = makeUseAtom(CONTEXTS.sigma);
 export const useSelection = makeUseAtom(CONTEXTS.selection);
-export const useImportState = makeUseAtom(CONTEXTS.importState);
-export const useExportState = makeUseAtom(CONTEXTS.exportState);
+export const useFile = makeUseAtom(CONTEXTS.file);
 export const useAppearance = makeUseAtom(CONTEXTS.appearance);
 export const useSigmaState = makeUseAtom(CONTEXTS.sigmaState);
 export const useSigmaGraph = makeUseAtom(CONTEXTS.sigmaGraph);
@@ -138,7 +126,6 @@ export const useFilteredGraph = makeUseAtom(CONTEXTS.filteredGraph);
 export const useVisualGetters = makeUseAtom(CONTEXTS.visualGetters);
 export const useSearch = makeUseAtom(CONTEXTS.search);
 export const useLayoutState = makeUseAtom(CONTEXTS.layoutState);
-export const useOrigin = makeUseAtom(CONTEXTS.origin);
 export const useUser = makeUseAtom(CONTEXTS.user);
 
 export const useSigmaActions = makeUseActions(sigmaActions);
@@ -148,8 +135,7 @@ export const useAppearanceActions = makeUseActions(appearanceActions);
 export const useGraphDatasetActions = makeUseActions(graphDatasetActions);
 export const usePreferencesActions = makeUseActions(preferencesActions);
 export const useSearchActions = makeUseActions(searchActions);
-export const useImportActions = makeUseActions(importActions);
-export const useExportActions = makeUseActions(exportActions);
+export const useFileActions = makeUseActions(fileActions);
 export const useLayoutActions = makeUseActions(layoutActions);
 export const useUserActions = makeUseActions(userActions);