fix linting errors, fix electron vite popping up index.html, docs typescript errors, etc. (#2265)

Author: sawka

.vscode/settings.json

@@ -54,5 +54,11 @@
     },
     "files.associations": {
         "*.css": "tailwindcss"
+    },
+    "go.lintTool": "staticcheck",
+    "gopls": {
+        "analyses": {
+            "QF1003": false
+        }
     }
 }

docs/docs/config.mdx

@@ -4,8 +4,8 @@ id: "config"
 title: "Configuration"
 ---
 
-import { Kbd } from "@site/src/components/kbd.tsx";
-import { PlatformProvider, PlatformSelectorButton } from "@site/src/components/platformcontext.tsx";
+import { Kbd } from "@site/src/components/kbd";
+import { PlatformProvider, PlatformSelectorButton } from "@site/src/components/platformcontext";
 
 <PlatformProvider>
 

docs/src/components/platformcontext.tsx

@@ -46,7 +46,7 @@ const PlatformProviderInternal = ({ children }: { children: ReactNode }) => {
     );
 };
 
-export const PlatformProvider: React.FC = ({ children }: { children: ReactNode }) => {
+export const PlatformProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
     return (
         <BrowserOnly fallback={<div />}>
             {() => <PlatformProviderInternal>{children}</PlatformProviderInternal>}

electron.vite.config.ts

@@ -27,6 +27,9 @@ export default defineConfig({
                 "@": "frontend",
             },
         },
+        server: {
+            open: false,
+        },
         define: {
             "process.env.WS_NO_BUFFER_UTIL": "true",
             "process.env.WS_NO_UTF_8_VALIDATE": "true",
@@ -47,6 +50,9 @@ export default defineConfig({
             },
             outDir: "dist/preload",
         },
+        server: {
+            open: false,
+        },
         plugins: [tsconfigPaths(), flow()],
     },
     renderer: {

emain/emain-tabview.ts

@@ -74,7 +74,7 @@ export class WaveTabView extends WebContentsView {
         });
         wcIdToWaveTabMap.set(this.webContents.id, this);
         if (isDevVite) {
-            this.webContents.loadURL(`${process.env.ELECTRON_RENDERER_URL}/index.html}`);
+            this.webContents.loadURL(`${process.env.ELECTRON_RENDERER_URL}/index.html`);
         } else {
             this.webContents.loadFile(path.join(getElectronAppBasePath(), "frontend", "index.html"));
         }

emain/emain-util.ts

@@ -56,7 +56,9 @@ export function handleCtrlShiftState(sender: Electron.WebContents, waveEvent: Wa
 }
 
 export function shNavHandler(event: Electron.Event<Electron.WebContentsWillNavigateEventParams>, url: string) {
-    if (url.startsWith("http://127.0.0.1:5173/index.html") || url.startsWith("http://localhost:5173/index.html")) {
+    const isDev = !electron.app.isPackaged;
+    if (isDev && (url.startsWith("http://127.0.0.1:5173/index.html") || url.startsWith("http://localhost:5173/index.html") ||
+                  url.startsWith("http://127.0.0.1:5174/index.html") || url.startsWith("http://localhost:5174/index.html"))) {
         // this is a dev-mode hot-reload, ignore it
         console.log("allowing hot-reload of index.html");
         return;

frontend/app/view/preview/directorypreview.tsx

@@ -386,15 +386,15 @@ function DirectoryTable({
     useLayoutEffect(() => {
         const rows = table.getRowModel()?.flatRows;
         let foundParentDir = false;
-        
+
         for (const row of rows) {
             if (row.getValue("name") == "..") {
                 row.pin("top");
                 foundParentDir = true;
                 break;
             }
         }
-        
+
         // If we didn't find the ".." row, reset the pinning to avoid stale references
         if (!foundParentDir) {
             table.resetRowPinning();
@@ -520,34 +520,39 @@ function TableBody({
 }: TableBodyProps) {
     const dummyLineRef = useRef<HTMLDivElement>();
     const warningBoxRef = useRef<HTMLDivElement>();
-    const rowRefs = useRef<HTMLDivElement[]>([]);
     const conn = useAtomValue(model.connection);
     const setErrorMsg = useSetAtom(model.errorMsgAtom);
 
     useEffect(() => {
-        if (focusIndex !== null && rowRefs.current[focusIndex] && bodyRef.current && osRef) {
-            const viewport = osRef.osInstance().elements().viewport;
-            const viewportHeight = viewport.offsetHeight;
-            const rowElement = rowRefs.current[focusIndex];
-            const rowRect = rowElement.getBoundingClientRect();
-            const parentRect = viewport.getBoundingClientRect();
-            const viewportScrollTop = viewport.scrollTop;
-            const rowTopRelativeToViewport = rowRect.top - parentRect.top + viewport.scrollTop;
-            const rowBottomRelativeToViewport = rowRect.bottom - parentRect.top + viewport.scrollTop;
-            if (rowTopRelativeToViewport - 30 < viewportScrollTop) {
-                // Row is above the visible area
-                let topVal = rowTopRelativeToViewport - 30;
-                if (topVal < 0) {
-                    topVal = 0;
-                }
-                viewport.scrollTo({ top: topVal });
-            } else if (rowBottomRelativeToViewport + 5 > viewportScrollTop + viewportHeight) {
-                // Row is below the visible area
-                const topVal = rowBottomRelativeToViewport - viewportHeight + 5;
-                viewport.scrollTo({ top: topVal });
+        if (focusIndex === null || !bodyRef.current || !osRef) {
+            return;
+        }
+        
+        const rowElement = bodyRef.current.querySelector(`[data-rowindex="${focusIndex}"]`) as HTMLDivElement;
+        if (!rowElement) {
+            return;
+        }
+        
+        const viewport = osRef.osInstance().elements().viewport;
+        const viewportHeight = viewport.offsetHeight;
+        const rowRect = rowElement.getBoundingClientRect();
+        const parentRect = viewport.getBoundingClientRect();
+        const viewportScrollTop = viewport.scrollTop;
+        const rowTopRelativeToViewport = rowRect.top - parentRect.top + viewport.scrollTop;
+        const rowBottomRelativeToViewport = rowRect.bottom - parentRect.top + viewport.scrollTop;
+        
+        if (rowTopRelativeToViewport - 30 < viewportScrollTop) {
+            // Row is above the visible area
+            let topVal = rowTopRelativeToViewport - 30;
+            if (topVal < 0) {
+                topVal = 0;
             }
+            viewport.scrollTo({ top: topVal });
+        } else if (rowBottomRelativeToViewport + 5 > viewportScrollTop + viewportHeight) {
+            // Row is below the visible area
+            const topVal = rowBottomRelativeToViewport - viewportHeight + 5;
+            viewport.scrollTo({ top: topVal });
         }
-        // setIndexChangedFromClick(false);
     }, [focusIndex]);
 
     const handleFileContextMenu = useCallback(
@@ -730,6 +735,7 @@ const TableRow = React.forwardRef(function ({
     return (
         <div
             className={clsx("dir-table-body-row", { focused: focusIndex === idx })}
+            data-rowindex={idx}
             onDoubleClick={() => {
                 const newFileName = row.getValue("path") as string;
                 model.goHistory(newFileName);

staticcheck.conf

@@ -0,0 +1,2 @@
+checks = ["all", "-ST1005", "-QF1003", "-ST1000", "-ST1003"]
+