Merge pull request #195 from 6174/0.0.7-alpha

0.0.7 alpha

README.md

@@ -25,8 +25,8 @@ If you like ComflowySpace, give our repo a [⭐ Star](https://github.com/6174/co
 
 ## Download
 
-* **MacOS:**  [Mac Intel](https://github.com/6174/comflowyspace/releases/download/v0.0.6-alpha/comflowy-0.0.6-alpha.dmg) | [Mac M](https://github.com/6174/comflowyspace/releases/download/v0.0.6-alpha/comflowy-0.0.6-alpha-arm64.dmg) 
-* **[Windows](https://github.com/6174/comflowyspace/releases/download/v0.0.6-alpha/comflowy-0.0.6-alpha.zip)**
+* **MacOS:**  [Mac Intel](https://github.com/6174/comflowyspace/releases/download/v0.0.7-alpha/comflowy-0.0.7-alpha.dmg) | [Mac M](https://github.com/6174/comflowyspace/releases/download/v0.0.7-alpha/comflowy-0.0.7-alpha-arm64.dmg) 
+* **[Windows](https://github.com/6174/comflowyspace/releases/download/v0.0.7-alpha/comflowy-0.0.7-alpha.zip)**
 
 
 ## Key Features

apps/electron-backend/package.json

@@ -1,6 +1,6 @@
 {
   "name": "comflowy",
-  "version": "0.0.6-alpha",
+  "version": "0.0.7-alpha",
   "private": true,
   "main": "layers/main/dist/index.js",
   "scripts": {

apps/electron-frontend/.env.development

@@ -1,2 +1,3 @@
-NEXT_PUBLIC_APP_VERSION=0.0.6-alpha
-NEXT_PUBLIC_API_SERVER=http://localhost:3000
+NEXT_PUBLIC_APP_VERSION=0.0.7-alpha
+NEXT_PUBLIC_API_SERVER=http://localhost:3000
+SENTRY_AUTH_TOKEN=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

apps/electron-frontend/.env.production

@@ -1,2 +1,3 @@
-NEXT_PUBLIC_APP_VERSION=0.0.6-alpha
-NEXT_PUBLIC_API_SERVER=https://www.comflowy.com
+NEXT_PUBLIC_APP_VERSION=0.0.7-alpha
+NEXT_PUBLIC_API_SERVER=https://www.comflowy.com
+SENTRY_AUTH_TOKEN=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

apps/electron-frontend/next.config.js

@@ -1,4 +1,5 @@
 const path = require("path");
+const { withSentryConfig } = require("@sentry/nextjs");
 /**
  * @type {import('next').NextConfig}
  */
@@ -15,6 +16,26 @@ const nextConfig = {
     }
     return config;
   },
+  sentry: {
+  }
 }
+const sentryWebpackPluginOptions = {
+  // Additional config options for the Sentry webpack plugin. Keep in mind that
+  // the following options are set automatically, and overriding them is not
+  // recommended:
+  //   release, url, configFile, stripPrefix, urlPrefix, include, ignore
 
-module.exports = nextConfig
+  org: "httpscomflowycom",
+  project: "javascript-nextjs",
+
+  // An auth token is required for uploading source maps.
+  authToken: process.env.SENTRY_AUTH_TOKEN,
+
+  silent: true, // Suppresses all logs
+
+  // For all available options, see:
+  // https://github.com/getsentry/sentry-webpack-plugin#options.
+};
+
+
+module.exports = withSentryConfig(nextConfig, sentryWebpackPluginOptions)

apps/electron-frontend/package.json

@@ -10,8 +10,10 @@
   "dependencies": {
     "@ant-design/cssinjs": "^1.17.0",
     "@ant-design/icons": "^5.2.6",
+    "@aptabase/react": "^0.3.3",
     "@comflowy/common": "workspace:*",
     "@comflowy/node": "workspace:*",
+    "@sentry/nextjs": "^7.100.1",
     "@types/color": "^3.0.6",
     "@types/lodash": "^4.14.202",
     "antd": "5.12.5",

apps/electron-frontend/sentry.client.config.js

@@ -0,0 +1,23 @@
+import * as Sentry from "@sentry/nextjs";
+
+Sentry.init({
+  dsn: "https://c22ceb8e2ea24010369ea2497e96fbd6@o4506737077256192.ingest.sentry.io/4506737079156736",
+  // Replay may only be enabled for the client-side
+  integrations: [Sentry.replayIntegration()],
+  environment: process.env.NODE_ENV || 'development',
+  // Set tracesSampleRate to 1.0 to capture 100%
+  // of transactions for performance monitoring.
+  // We recommend adjusting this value in production
+  tracesSampleRate: 1.0,
+
+  // Capture Replay for 10% of all sessions,
+  // plus for 100% of sessions with an error
+  replaysSessionSampleRate: 0.1,
+  replaysOnErrorSampleRate: 1.0,
+
+  // ...
+
+  // Note: if you want to override the automatic release value, do not set a
+  // `release` value here - use the environment variable `SENTRY_RELEASE`, so
+  // that it will also get attached to your source maps
+});

apps/electron-frontend/sentry.edge.config.js

@@ -0,0 +1,16 @@
+import * as Sentry from "@sentry/nextjs";
+
+Sentry.init({
+  dsn: "https://c22ceb8e2ea24010369ea2497e96fbd6@o4506737077256192.ingest.sentry.io/4506737079156736",
+
+  // Set tracesSampleRate to 1.0 to capture 100%
+  // of transactions for performance monitoring.
+  // We recommend adjusting this value in production
+  tracesSampleRate: 1.0,
+
+  // ...
+
+  // Note: if you want to override the automatic release value, do not set a
+  // `release` value here - use the environment variable `SENTRY_RELEASE`, so
+  // that it will also get attached to your source maps
+});

apps/electron-frontend/sentry.server.config.js

@@ -0,0 +1,16 @@
+import * as Sentry from "@sentry/nextjs";
+
+Sentry.init({
+  dsn: "https://c22ceb8e2ea24010369ea2497e96fbd6@o4506737077256192.ingest.sentry.io/4506737079156736",
+
+  // Set tracesSampleRate to 1.0 to capture 100%
+  // of transactions for performance monitoring.
+  // We recommend adjusting this value in production
+  tracesSampleRate: 1.0,
+
+  // ...
+
+  // Note: if you want to override the automatic release value, do not set a
+  // `release` value here - use the environment variable `SENTRY_RELEASE`, so
+  // that it will also get attached to your source maps
+});

apps/electron-frontend/src/components/bootstrap/bootstrap-task.tsx

@@ -1,4 +1,5 @@
 import { useRemoteTask } from "@/lib/utils/use-remote-task";
+import { useAptabase } from "@aptabase/react";
 import { getBackendUrl } from "@comflowy/common/config";
 import { BootStrapTaskType, useDashboardState } from "@comflowy/common/store/dashboard-state";
 import {message} from "antd";
@@ -12,6 +13,7 @@ export function BootstrapTask(props: BootstrapTaskProps) {
   // const [messageApi, contextHolder] = message.useMessage();
   const {bootstrapTasks, setBootstrapTasks} = useDashboardState();
   const task = bootstrapTasks.find(task => task.type === props.type);
+  const { trackEvent } = useAptabase();
   const {startTask, error, success, running, messages} = useRemoteTask({
       api: getBackendUrl(`/api/add_bootstrap_task`),
       onMessage: (msg) => {
@@ -21,18 +23,20 @@ export function BootstrapTask(props: BootstrapTaskProps) {
             message.success(task.title + " success");
             task.finished = true;
             setBootstrapTasks([...bootstrapTasks]);
+            trackEvent(`bootstrap-task-${task.title}-success`);
           }
         }
         if (msg.type === "FAILED") {
           message.error("Task failed: " + msg.error);
+          trackEvent(`bootstrap-task-${task.title}-failed`);
         }
 
         if (msg.type === "TIMEOUT" && task.type === BootStrapTaskType.startComfyUI) {
           message.error("Start ComfyUI timeout, check the comfyui process manager to find out what happened");
           task.finished = true;
           setBootstrapTasks([...bootstrapTasks]);
+          trackEvent(`bootstrap-task-${task.title}-timeout`);
         }
-
       }
   });
 

apps/electron-frontend/src/components/bootstrap/install-comfyui.tsx

@@ -1,7 +1,13 @@
 import { BootStrapTaskType } from "@comflowy/common/store/dashboard-state";
 import { BootstrapTask } from "./bootstrap-task";
+import { useEffect } from "react";
+import { useAptabase } from "@aptabase/react";
 
 export function InstallComfyUI() {
+  const { trackEvent } = useAptabase();
+  useEffect(() => {
+    trackEvent('bootstrap-install-comfyui');
+  }, []);
   return (
     <div className="InstallComfyUI">
       <BootstrapTask type={BootStrapTaskType.installComfyUI}/>

apps/electron-frontend/src/components/bootstrap/install-conda.tsx

@@ -1,7 +1,13 @@
 import { BootStrapTaskType } from "@comflowy/common/store/dashboard-state";
 import { BootstrapTask } from "./bootstrap-task";
+import { useEffect } from "react";
+import { useAptabase } from "@aptabase/react";
 
 export function InstallConda() {
+  const { trackEvent } = useAptabase();
+  useEffect(() => {
+    trackEvent('bootstrap-install-conda');
+  }, []);
   return (
     <div className="InstallConda">
       <BootstrapTask type={BootStrapTaskType.installConda}/>

apps/electron-frontend/src/components/bootstrap/install-git.tsx

@@ -1,7 +1,13 @@
 import { BootStrapTaskType } from "@comflowy/common/store/dashboard-state";
 import { BootstrapTask } from "./bootstrap-task";
+import { useAptabase } from "@aptabase/react";
+import { useEffect } from "react";
 
 export function InstallGit() {
+  const { trackEvent } = useAptabase();
+  useEffect(() => {
+    trackEvent('bootstrap-install-git');
+  }, []);
   return (
     <div className="InstallGit">
       <BootstrapTask type={BootStrapTaskType.installGit}/>

apps/electron-frontend/src/components/bootstrap/install-python.tsx

@@ -1,6 +1,12 @@
 import { BootStrapTaskType } from "@comflowy/common/store/dashboard-state";
 import { BootstrapTask } from "./bootstrap-task";
+import { useEffect } from "react";
+import { useAptabase } from "@aptabase/react";
 export function InstallPython() {
+  const { trackEvent } = useAptabase();
+  useEffect(() => {
+    trackEvent('bootstrap-install-python');
+  }, []);
   return (
     <div className="InstallPython">
       <BootstrapTask type={BootStrapTaskType.installPython}/>

apps/electron-frontend/src/components/bootstrap/install-torch.tsx

@@ -1,6 +1,12 @@
 import { BootStrapTaskType } from "@comflowy/common/store/dashboard-state";
 import { BootstrapTask } from "./bootstrap-task";
+import { useAptabase } from "@aptabase/react";
+import { useEffect } from "react";
 export function InstallTorch() {
+  const { trackEvent } = useAptabase();
+  useEffect(() => {
+    trackEvent('bootstrap-install-torch');
+  }, []);
   return (
     <div className="InstallTorch">
       <BootstrapTask type={BootStrapTaskType.installTorch}/>

apps/electron-frontend/src/components/bootstrap/setup-config.tsx

@@ -1,4 +1,5 @@
 import { comfyElectronApi, isElectron, useIsElectron } from "@/lib/electron-bridge";
+import { useAptabase } from "@aptabase/react";
 import { getBackendUrl } from "@comflowy/common/config";
 import { BootStrapTaskType, useDashboardState } from "@comflowy/common/store/dashboard-state";
 import { Alert, Button, Input, Space, message } from "antd";
@@ -15,6 +16,11 @@ export function SetupConfig() {
   const [selectedIfInstalledComfyUI, setSelectedIfInstalledComfyUI] = useState(false);
   const [installedComfyUI, setInstalledComfyUI] = useState(false);
 
+  const { trackEvent } = useAptabase();
+  useEffect(() => {
+    trackEvent('bootstrap-setup-config');  
+  }, []);
+
   useEffect(() => {
     if (electronEnv) {
       const promise = comfyElectronApi.selectHomeDir();
@@ -39,17 +45,6 @@ export function SetupConfig() {
     }
   }, []);
 
-  const selectSdWebUIFolder = useCallback(async () => {
-    try {
-      const ret = await comfyElectronApi.selectDirectory();
-      const folder = ret[0];
-      setSDWebuiPath(folder);
-    } catch (err) {
-      console.log(err);
-      message.error(err);
-    }
-  }, []);
-
   const useDefaultFolder = useCallback(() => {
       setValue(defaultValue);
   }, [value, defaultValue]);
@@ -80,8 +75,11 @@ export function SetupConfig() {
         task.finished = true;
         const isComfyUIInstalled = data.isComfyUIInstalled;
         if (isComfyUIInstalled) {
+          trackEvent('bootstrap-setup-config-success-with-comfyui-installed');
           const installComfyTask = bootstrapTasks.find(task => task.type === BootStrapTaskType.installComfyUI);
           installComfyTask.finished = true;
+        } else {
+          trackEvent('bootstrap-setup-config-success-without-comfyui-installed');
         }
         setBootstrapTasks([...bootstrapTasks]);
       } else {

apps/electron-frontend/src/components/bootstrap/start-comfyui.tsx

@@ -1,7 +1,13 @@
 import { BootStrapTaskType } from "@comflowy/common/store/dashboard-state";
 import { BootstrapTask } from "./bootstrap-task";
+import { useEffect } from "react";
+import { useAptabase } from "@aptabase/react";
 
 export function StartComfyUI() {
+  const { trackEvent } = useAptabase();
+  useEffect(() => {
+    trackEvent('bootstrap-start-comfyui');
+  }, []);
   return (
     <div className="StartComfyUI">
       <BootstrapTask type={BootStrapTaskType.startComfyUI}/>

apps/electron-frontend/src/components/my-workflows/import.tsx

@@ -1,4 +1,5 @@
 import { openTabPage } from '@/lib/electron-bridge';
+import { useAptabase } from '@aptabase/react';
 import { readWorkflowFromFile, readWorkflowFromPng } from '@comflowy/common/comfyui-bridge/export-import';
 import { PersistedWorkflowDocument, documentDatabaseInstance } from '@comflowy/common/storage/document-database';
 import { useAppStore } from '@comflowy/common/store';
@@ -11,16 +12,18 @@ export const ImportWorkflow = () => {
   const [selectedFile, setSelectedFile] = useState<File | null>(null);
   const fileInputRef = useRef<HTMLInputElement>(null);
   const widgets = useAppStore(st => st.widgets);
-
+  const { trackEvent } = useAptabase();
   const onFileSelected = async (file: File) => {
     try {
       let workflow: PersistedWorkflowDocument | null = null;
       if (file.type === 'image/png') {
         workflow = await readWorkflowFromPng(file, widgets);
+        trackEvent('import-png-workflow');
       }
 
       if (file.type === 'application/json') {
         workflow = await readWorkflowFromFile(file, widgets);
+        trackEvent('import-json-workflow');
       }
 
       if (workflow) {
@@ -36,7 +39,10 @@ export const ImportWorkflow = () => {
       }
 
     } catch(err) {
-      console.log(err);
+      trackEvent('import-workflow-error', {
+        error: err.message,
+        stack: err.stack
+      });
       message.error("Unexpected error: " + err.message, 3);
     }
   }

apps/electron-frontend/src/components/my-workflows/my-workflows.tsx

@@ -19,6 +19,7 @@ function MyWorkflowsPage() {
 
 function WorkflowCreateBox() {
   const router = useRouter();
+  const { trackEvent } = useAptabase();
   const createNewDoc = React.useCallback(async (open: boolean = true) => {
     const doc = await documentDatabaseInstance.createDocFromTemplate();
     if (open) {
@@ -31,6 +32,7 @@ function WorkflowCreateBox() {
       });
       message.success("Workflow created");
     }
+    trackEvent("create-new-worklfow");
   }, [router]);
 
   React.useEffect(() => {
@@ -85,6 +87,7 @@ import { GalleryItem, PreviewImage } from '@comflowy/common/comfui-interfaces';
 import { EllipsisOutlined } from '@ant-design/icons';
 import { JSONDBClient } from '@comflowy/common/jsondb/jsondb.client';
 import { GlobalEvents, SlotGlobalEvent } from '@comflowy/common/utils/slot-event';
+import { useAptabase } from '@aptabase/react';
 
 function WorkflowList() {
   const docs = (JSONDBClient.useLiveJSONDB<PersistedFullWorkflow[]>({