@rozenite/performance-monitor-plugin 1.0.0-alpha.11

package/src/ui/components/SessionDuration.tsx

@@ -0,0 +1,54 @@
+import { useEffect, useState } from 'react';
+import { Text } from '@radix-ui/themes';
+
+export type SessionDurationProps = {
+  isActive: boolean;
+  sessionStartedAt: number;
+};
+
+export const SessionDuration = ({
+  isActive,
+  sessionStartedAt,
+}: SessionDurationProps) => {
+  const [currentTime, setCurrentTime] = useState<number | null>(null);
+
+  useEffect(() => {
+    if (!isActive) {
+      return;
+    }
+
+    setCurrentTime(Date.now());
+    const interval = setInterval(() => {
+      setCurrentTime(Date.now());
+    }, 1000);
+
+    return () => clearInterval(interval);
+  }, [isActive]);
+
+  const formatTime = (timestamp: number) => {
+    return new Date(timestamp).toLocaleTimeString();
+  };
+
+  const formatDuration = (duration: number) => {
+    return `${Math.round(duration)}s`;
+  };
+
+  const getSessionDuration = () => {
+    if (!currentTime || !sessionStartedAt) return 0;
+    return currentTime - sessionStartedAt;
+  };
+
+  return (
+    <>
+      <Text size="2" color="gray">
+        Session started:{' '}
+        {sessionStartedAt ? formatTime(sessionStartedAt) : 'Not started'}
+      </Text>
+      {!!sessionStartedAt && (
+        <Text size="2" color="gray">
+          Duration: {formatDuration(getSessionDuration() / 1000)}
+        </Text>
+      )}
+    </>
+  );
+};

package/src/ui/utils.ts

@@ -0,0 +1,17 @@
+export const downloadFile = async (data: unknown, filename: string) => {
+  const json = JSON.stringify(data, null, 2);
+  const blob = new Blob([json], { type: 'application/json' });
+
+  const url = URL.createObjectURL(blob);
+  const link = document.createElement('a');
+  link.href = url;
+  link.download = filename;
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+  URL.revokeObjectURL(url);
+};
+
+export const formatTime = (timestamp: number): string => {
+  return new Date(timestamp).toLocaleTimeString();
+};

package/tsconfig.json

@@ -0,0 +1,32 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx"
+  },
+  "include": ["src/**/*", "react-native.ts", "rozenite.config.ts"],
+  "exclude": ["node_modules", "dist", "build"],
+  "references": [
+    {
+      "path": "../plugin-bridge"
+    },
+    {
+      "path": "../cli"
+    },
+    {
+      "path": "../vite-plugin"
+    }
+  ]
+}

package/tsconfig.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["./src/react-native/usehandledevtoolsmessages.ts","./src/react-native/usehandleinitialdata.ts","./src/react-native/usesynctanstackcache.ts","./src/react-native/usetanstackquerydevtools.ts","./src/shared/dehydrate.ts","./src/shared/hydrate.ts","./src/shared/messaging.ts","./src/shared/types.ts","./src/shared/usesynconlinestatus.ts","./src/ui/tanstack-query.tsx","./src/ui/usehandlesyncmessages.ts","./src/ui/usesyncdevtoolsevents.ts","./src/ui/usesyncinitialdata.ts","./react-native.ts","./rozenite.config.ts"],"errors":true,"version":"5.8.3"}

package/vite.config.ts

@@ -0,0 +1,20 @@
+/// <reference types='vitest' />
+import { defineConfig } from 'vite';
+import { rozenitePlugin } from '@rozenite/vite-plugin';
+
+export default defineConfig({
+  root: __dirname,
+  plugins: [rozenitePlugin()],
+  base: './',
+  build: {
+    outDir: './dist',
+    emptyOutDir: false,
+    reportCompressedSize: false,
+    minify: true,
+    sourcemap: false,
+  },
+  server: {
+    port: 3000,
+    open: true,
+  },
+});