package.json

@@ -7,8 +7,7 @@
   "scripts": {
     "dev": "npm-run-all --parallel dev:react dev:electron",
     "dev:react": "vite",
-    "dev:electron": "npm run build && cross-env NODE_ENV=development electron .",
-    "prod:electron": "npm run build && cross-env NODE_ENV=production electron .",
+    "dev:electron": "npm run transpile:electron && cross-env NODE_ENV=development electron --inspect=5858 .",
     "build": "tsc && vite build",
     "preview": "vite preview",
     "transpile:electron": "tsc --project src/electron/tsconfig.json",
@@ -21,7 +20,6 @@
   "dependencies": {
     "@reduxjs/toolkit": "^2.10.1",
     "@tailwindcss/vite": "^4.1.16",
-    "active-win": "^7.2.0",
     "axios": "^1.13.2",
     "chalk": "^5.6.2",
     "electron-store": "^11.0.2",
@@ -35,14 +33,12 @@
     "react-router-dom": "^7.9.5",
     "recharts": "^2.12.7",
     "sharp": "^0.34.4",
-    "socket.io-client": "^4.8.1",
-    "tailwindcss": "^4.1.16",
-    "windowmanager": "^0.14.8"
+    "tailwindcss": "^4.1.16"
   },
   "devDependencies": {
     "@playwright/test": "^1.47.2",
     "@types/luxon": "^3.7.1",
-    "@types/node": "^22.19.0",
+    "@types/node": "^22.5.5",
     "@types/os-utils": "^0.0.4",
     "@types/react": "^18.3.8",
     "@types/react-dom": "^18.3.0",
@@ -51,7 +47,6 @@
     "daisyui": "^5.4.3",
     "electron": "^32.1.2",
     "electron-builder": "^25.0.5",
-    "electron-rebuild": "^3.2.9",
     "npm-run-all": "^4.1.5",
     "typescript": "^5.6.2",
     "vite": "^5.4.7",

src/assets/splash.html

@@ -1,29 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <style>
-    body {
-      margin: 0;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      background: #ffffff;
-      font-family: Arial, sans-serif;
-    }
-    .loader {
-      width: 50px;
-      height: 50px;
-      border: 5px solid #e0e0e0;
-      border-top-color: #6a5acd;
-      border-radius: 50%;
-      animation: spin 1s linear infinite;
-    }
-    @keyframes spin {
-      to { transform: rotate(360deg); }
-    }
-  </style>
-</head>
-<body>
-  <div class="loader"></div>
-</body>
-</html>

src/electron/ipc/ipcHandler.ts

@@ -1,6 +1,6 @@
 import { ipcMain, BrowserWindow } from "electron";
 import { getToken, saveToken, clearToken } from "../utils/tokenHelper.js";
-import { getActiveApp, handleLogin, takeScreenshot, startWindowPolling, getRunningAppsList, captureSpecificApp } from "../utils/utilityFunctions.js";
+import { getActiveApp, handleLogin, takeScreenshot, startWindowPolling } from "../utils/utilityFunctions.js";
 import api from "../api/axiosClient.js";
 import { getMainWindow } from '../main.js';
 
@@ -83,7 +83,7 @@ export const registerIPCHandlers = (mainWindow: BrowserWindow) => {
 
 
 ipcMain.handle("get-project-list", async () => {
-  console.log("📡 get-project-list called");
+  // console.log("📡 get-project-list called");
   try {
     const res = await api.get("/list/projects");
 
@@ -226,14 +226,6 @@ ipcMain.handle("forgot-password", async (event, email: string) => {
     };
   }
 });
-ipcMain.handle('get-running-apps', async () => {
-  return await getRunningAppsList()
-});
-
-ipcMain.handle('capture-specific-window', async (event, appTitle: string) => {
-  console.log(appTitle, "IPC HANDLE")
-  return await captureSpecificApp(appTitle)
-});
 
 
 ipcMain.handle("get-profile", async () => {

src/electron/main.ts

@@ -1,179 +1,98 @@
-import { app, BrowserWindow, globalShortcut, session } from "electron";
-import { isDev } from "./util.js";
-// import { pollResources } from "./resourceManager.js";
-import { getPreloadPath, getUIPath } from "./pathResolver.js";
-import { registerIPCHandlers } from "./ipc/ipcHandler.js";
+import { app, BrowserWindow, ipcMain, session } from 'electron';
+import { ipcMainHandle, ipcMainOn, isDev } from './util.js';
+import { getStaticData, pollResources } from './resourceManager.js';
+import { getPreloadPath, getUIPath } from './pathResolver.js';
 
 import "./ipc/ipcHandler.js";
-import path from "path";
-import { fileURLToPath } from "url";
+import { registerIPCHandlers } from './ipc/ipcHandler.js';
 
-app.setAppUserModelId("com.tracker.app");
+let mainWindow:any = null;
 
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
+app.on('ready', async () => {
+  console.log("ready");
 
-// ---------------------------
-// SINGLE INSTANCE LOCK
-// ---------------------------
-const gotTheLock = app.requestSingleInstanceLock();
+  mainWindow = new BrowserWindow({
+    width: 500,           // fixed width
+    height: 600,           // fixed height
     
-if (!gotTheLock) {
-  app.quit();
-  process.exit(0);
-}
-
-let mainWindow: BrowserWindow | null = null;
-let splashWindow: BrowserWindow | null = null;
-
-// ---------------------------
-// HANDLE DOUBLE OPEN ATTEMPT
-// ---------------------------
-app.on("second-instance", () => {
-  if (mainWindow) {
-    if (mainWindow.isMinimized()) mainWindow.restore();
-    mainWindow.show();
-    mainWindow.focus();
-  }
-});
-
-// ---------------------------
-// MAIN APP READY
-// ---------------------------
-app.on("ready", async () => {
-
-
-  splashWindow = new BrowserWindow({
-    width: 300,
-    height: 300,
-    frame: false,
-    transparent: false,
-    alwaysOnTop: false,   // splash does NOT need to be on top || Yooo Don't make it onTop
-    resizable: false,
-    show: true,
-    skipTaskbar: true,
-    webPreferences: {
-      devTools: false,
-    }
-  });
-
-
-  splashWindow.loadFile(
-    path.join(__dirname, "../assets/splash.html")
-  );
-
-  // Create the main window
-  const win = new BrowserWindow({
-    width: 500,
-    height: 600,
-    resizable: false,
-    fullscreenable: false,
-    minimizable: false,
-    maximizable: false,
+    resizable: false,      // prevents resizing
+    fullscreenable: false, // disables fullscreen toggle (F11 or double-click title bar)
+    minimizable: false,       // disables minimize button
+    maximizable: false,    // prevents maximize
     closable: true,
     alwaysOnTop: true,
-    skipTaskbar: true,
     autoHideMenuBar: true,
-    frame: process.platform === "darwin" ? false : true,
-    show: false, // speed improvement
+   
+    frame: process.platform === 'darwin' ? false : true,
     webPreferences: {
-      devTools: false,
       preload: getPreloadPath(),
-      contextIsolation: true,
-      nodeIntegration: false,
     },
   });
 
-  mainWindow = win;
-
-  // ------------------------------------
-  // ONLY LOG NETWORK REQUESTS IN DEV
-  // ------------------------------------
-  if (isDev() && process.env.LOG_REQUESTS === "true") {
   session.defaultSession.webRequest.onBeforeRequest((details, callback) => {
-      console.log("🌐 Request:", details.method, details.url);
+    console.log('🌐 Request:', details.method, details.url);
     callback({ cancel: false });
   });
-  }
 
-  // ------------------------------------
-  // LOAD FRONTEND
-  // ------------------------------------
   if (isDev()) {
-    win.loadURL("http://localhost:5123");
-    // win.webContents.openDevTools(); // Optional (slows startup)
+    mainWindow.loadURL('http://localhost:5123');
+    mainWindow.webContents.openDevTools();
   } else {
-    win.loadFile(getUIPath());
+    mainWindow.loadFile(getUIPath());
   }
 
-  // ------------------------------------
-  // SHOW WINDOW WHEN READY (no white flash)
-  // ------------------------------------
-  win.once("ready-to-show", () => {
-    // Delay heavy work to improve startup speed
-    setTimeout(() => {
-      splashWindow?.close();
-      splashWindow = null;
+  // pollResources(mainWindow);
+  // 🔹 Register all IPC handlers (includes polling)
+  registerIPCHandlers(mainWindow);
 
-      win.show();
-      // pollResources(win);
-      registerIPCHandlers(win);
-    }, 500);
-  });
+  pollResources(mainWindow);
 
-  // ------------------------------------
-  // HANDLE CLOSE EVENTS
-  // ------------------------------------
-  handleCloseEvents(win);
+  // IPC handlers
+  // ipcMainHandle('getStaticData', () => getStaticData());
+
+  // ipcMainOn('sendFrameAction', (payload) => {
+  //   switch (payload) {
+  //     case 'CLOSE':
+  //       mainWindow.close();
+  //       break;
+  //     case 'MAXIMIZE':
+  //       // prevent maximize
+  //       break;
+  //     case 'MINIMIZE':
+  //       mainWindow.minimize();
+  //       break;
+  //   }
+  // });
+
+  handleCloseEvents(mainWindow);
 });
 
-
-app.on('browser-window-focus', () => {
-  globalShortcut.register('CommandOrControl+R', () => {
-    // Do nothing; disables reload
-  });
-  globalShortcut.register('F5', () => {
-    // Do nothing; disables reload
-  });
-  globalShortcut.register('CommandOrControl+Shift+I', () => {
-    // Do nothing; disables DevTools
-  });
-});
-
-app.on('browser-window-blur', () => {
-  globalShortcut.unregisterAll();
-});
-
-
-// ---------------------------
-// CUSTOM CLOSE BEHAVIOR
-// ---------------------------
-function handleCloseEvents(window: BrowserWindow) {
+function handleCloseEvents(mainWindow: BrowserWindow) {
   let willClose = false;
 
-  window.on("close", (e) => {
+  mainWindow.on('close', (e) => {
     if (willClose) return;
 
     e.preventDefault();
-    window.hide();
+    mainWindow.hide();
 
     if (app.dock) {
       app.dock.hide();
     }
   });
 
-  app.on("before-quit", () => {
+  app.on('before-quit', () => {
     willClose = true;
   });
 
-  window.on("show", () => {
+  mainWindow.on('show', () => {
     willClose = false;
   });
 }
 
-// ---------------------------
-// GET MAIN WINDOW EXPORT
-// ---------------------------
+
+
 export function getMainWindow() {
   return mainWindow;
 }
+

src/electron/pathResolver.ts

@@ -11,10 +11,7 @@ export function getPreloadPath() {
 }
 
 export function getUIPath() {
-  return path.join(app.getAppPath(), "dist-react", "index.html");
-
-  // return "C:\\Users\\user\\OneDrive\\Desktop\\electron-main\\dist-react\\index.html";
-  // return path.join(app.getAppPath(), '/dist-react/index.html');
+  return path.join(app.getAppPath(), '/dist-react/index.html');
 }
 
 export function getAssetPath() {

src/electron/preload.cts

@@ -12,8 +12,6 @@ contextBridge.exposeInMainWorld('electron', {
   toggleCloseBtn: (shouldEnable: boolean) => ipcRenderer.invoke('toggle-close-btn', shouldEnable),
   resizeWindow: (width: number, height: number) => ipcRenderer.invoke('resize-window', width, height),
   getProjectList: () => ipcRenderer.invoke("get-project-list"),
-  getRunningApps: () => ipcRenderer.invoke('get-running-apps'),
-  captureAppScreenShot: (appTitle: string) : Promise<string> => ipcRenderer.invoke('capture-specific-window', appTitle),
   onWindowUpdate: (callback) =>
     ipcRenderer.on("window:updated", (_, data) => callback(data)),
 

src/electron/utils/utilityFunctions.ts

@@ -1,12 +1,10 @@
-import { app, BrowserWindow, desktopCapturer } from "electron";
+import { BrowserWindow, desktopCapturer } from "electron";
 import * as fs from "fs";
 import path from "path";
 import axios from 'axios';
 import sharp from 'sharp';
 import { saveToken } from "./tokenHelper.js";
 import { activeWindow } from "get-windows";
-import { exec } from "child_process";
-import { getUIPath } from "../pathResolver.js";
 
 // Blur using an offscreen canvas
 async function blurAndCompressBase64Image(base64: string): Promise<Buffer> {
@@ -55,12 +53,6 @@ export const handleLogin = async (credentials: { email: string, password: string
         // Call your login API
         console.log("🟡 login Request received", credentials);
 
-        console.log("Doom");
-        console.log("app.getAppPath()", app.getAppPath());
-        console.log("UIPATH", getUIPath());
-        console.log("Doom 1");
-
-
         try {
             console.log("➡️ Calling API...");
             const response = await axios.post(
@@ -107,7 +99,7 @@ export const handleLogin = async (credentials: { email: string, password: string
 export const getActiveApp = async () => {
   const result = await activeWindow();
   const dataWithTime = { ...result, timestamp: new Date().toISOString() };
-    //   console.log("🪟 Active Window with Time:", dataWithTime);
+//   console.log("🪟 Active Window with Time:", dataWithTime);
   return dataWithTime;
 };
 
@@ -125,61 +117,3 @@ export const startWindowPolling = (win: BrowserWindow) => {
 };
 
 
-export const getRunningAppsList = async () => {
-    try {
-        // PowerShell command: Get only apps with visible windows (non-background)
-        const sources = await desktopCapturer.getSources({
-            types: ['window', 'screen'],
-            thumbnailSize: { width: 150, height: 150 } // Optional: set thumbnail size
-        });
-
-        const app = sources.map(source => ({
-            name: source.name,
-            pid: source.id,
-            // thumbnail: source.thumbnail // Can be used as screenshot
-        }));
-        return app
-    } catch (error) {
-        return []
-    }
-}
-
-
-export const captureSpecificApp = async (windowTitle: string): Promise<string> => {
-    try {
-        const sources = await desktopCapturer.getSources({
-            types: ['window', 'screen'],
-            thumbnailSize: { width: 650, height: 430 }
-        });
-        const targetSource = sources.find(source => source.name === windowTitle);
-        if (targetSource) {
-
-            let image = targetSource.thumbnail.toDataURL();
-            const blurredBuffer = await blurAndCompressBase64Image(image);
-
-            // Convert buffer → base64 string
-            const base64String = `data:image/png;base64,${blurredBuffer.toString('base64')}`;
-
-            // ✅ Return the processed base64 instead of saving
-            return base64String;
-
-            // const folderPath = "C:\\Users\\Public\\vatracker\\screenshots";
-
-            // // Ensure directory exists
-            // if (!fs.existsSync(folderPath)) {
-            //     fs.mkdirSync(folderPath, { recursive: true });
-            // }
-
-            // const filePath = path.join(folderPath, `screenshot-${Date.now()}.png`);
-            // fs.writeFileSync(filePath, blurredBuffer);
-
-            // console.log(`Screenshot saved to ${filePath}`);
-        } else {
-            console.log(`Window with title "${windowTitle}" not found.`);
-            return "Not Found"
-        }
-    } catch (error) {
-        console.error('Error capturing screenshot:', error);
-        return 'Failed to capture screenshot.';
-    }
-}

src/ui/App.tsx

@@ -1,84 +1,5 @@
-// import React, { useEffect } from "react";
-// import { BrowserRouter, Route, Routes, Navigate } from "react-router-dom";
-// import { useDispatch, useSelector } from "react-redux";
-// import { AppDispatch, RootState } from "./store";
-// import { loadUserFromStorage } from "./store/userSlice";
-
-// import Login from "./pages/Login";
-// import Dashboard from "./pages/Dashboard";
-// import Projects from "./pages/Projects/Projects";
-// import DashboardLayout from "./layout/DashboardLayout";
-// import ProtectedRoute from "./routes/ProtectedRoute";
-// import PublicRoute from "./routes/PublicRoute";
-// import { ThemeToggle } from "./helper/ThemeToggle";
-// import LeaveAndAdjustments from "./pages/LeaveAndAdjustments/LeaveAndAdjustments";
-// import Timesheets from "./pages/Timesheets/Timesheets";
-// import Settings from "./pages/Settings/Settings";
-// import HelpSupport from "./pages/HelpSupport/HelpSupport";
-
-// const App: React.FC = () => {
-//   const theme = ThemeToggle();
-//   const dispatch = useDispatch<AppDispatch>();
-
-//   // ✅ Get user directly from Redux
-//   const user = useSelector((state: RootState) => state.user.user);
-
-//   useEffect(() => {
-//     document.documentElement.setAttribute("data-theme", theme);
-//   }, [theme]);
-
-//   // ✅ Load user from localStorage into Redux when app starts
-//   useEffect(() => {
-//     dispatch(loadUserFromStorage());
-//   }, [dispatch]);
-
-//   console.log("App.tsx → user:", user);
-
-//   return (
-//     <BrowserRouter>
-//       <Routes>
-//         {/* Public Route */}
-//         <Route
-//           path="/login"
-//           element={
-//             <PublicRoute user={user}>
-//               <Login />
-//             </PublicRoute>
-//           }
-//         />
-
-//         {/* Protected Routes */}
-//         <Route
-//           path="/dashboard"
-//           element={
-//             <ProtectedRoute user={user}>
-//               <DashboardLayout />
-//             </ProtectedRoute>
-//           }
-//         >
-//           <Route index element={<Dashboard />} />
-//           <Route path="projects" element={<Projects />} />
-//           <Route path="leave-adjustments" element={<LeaveAndAdjustments />} />
-//           <Route path="timesheet" element={<Timesheets />} />
-//           <Route path="settings" element={<Settings />} />
-//           <Route path="help-support" element={<HelpSupport />} />
-//         </Route>
-
-//         {/* Default Redirect */}
-//         <Route
-//           path="*"
-//           element={<Navigate to={user ? "/dashboard" : "/login"} replace />}
-//         />
-//       </Routes>
-//     </BrowserRouter>
-//   );
-// };
-
-// export default App;
-
-
 import React, { useEffect } from "react";
-import { HashRouter as Router, Route, Routes, Navigate } from "react-router-dom";
+import { BrowserRouter, Route, Routes, Navigate } from "react-router-dom";
 import { useDispatch, useSelector } from "react-redux";
 import { AppDispatch, RootState } from "./store";
 import { loadUserFromStorage } from "./store/userSlice";
@@ -99,6 +20,8 @@ const App: React.FC = () => {
   const theme = ThemeToggle();
   const dispatch = useDispatch<AppDispatch>();
 
+  
+
   // ✅ Get user directly from Redux
   const user = useSelector((state: RootState) => state.user.user);
 
@@ -106,6 +29,7 @@ const App: React.FC = () => {
     document.documentElement.setAttribute("data-theme", theme);
   }, [theme]);
 
+  // ✅ Load user from localStorage into Redux when app starts
   useEffect(() => {
     dispatch(loadUserFromStorage());
   }, [dispatch]);
@@ -113,7 +37,7 @@ const App: React.FC = () => {
   console.log("App.tsx → user:", user);
 
   return (
-    <Router>
+    <BrowserRouter>
       <Routes>
         {/* Public Route */}
         <Route
@@ -148,7 +72,7 @@ const App: React.FC = () => {
           element={<Navigate to={user ? "/dashboard" : "/login"} replace />}
         />
       </Routes>
-    </Router>
+    </BrowserRouter>
   );
 };
 

src/ui/layout/DashboardLayout.tsx

@@ -1,6 +1,4 @@
 import React, { useState, useEffect, useRef } from "react";
-import io, { Socket } from 'socket.io-client';
-
 import {
   Outlet,
   NavLink,
@@ -126,11 +124,6 @@ const DashboardLayout = () => {
     selectedProject?.projectName ?? null
   );
 
-  const socketRef = useRef<Socket | null>(null);
-  const intervalRef = useRef<number | null>(null);
-  const [isConnected, setIsConnected] = useState(false);
-  // const [seclectedScreen, setSelectedScreen] = useState<string | null>(null)
-
   const [projectsData, setProjectsData] = useState<Project[]>([]);
 
   useEffect(() => {
@@ -566,21 +559,6 @@ const DashboardLayout = () => {
       {isTracking &&
         <header className="w-full  flex justify-between items-center h-12 px-6 bg-base-100 border-b border-base-300 sticky top-0 z-30">
           {/* Left Section */}
-          {/* {!isConnected ? (
-          <button
-            onClick={handleConnect}
-            className="bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded"
-          >
-            Connect
-          </button>
-        ) : (
-          <button
-            onClick={handleDisconnect}
-            className="bg-red-600 hover:bg-red-700 text-white px-4 py-2 rounded"
-          >
-            Disconnect
-          </button>
-        )} */}
           <div className="flex items-center space-x-3">
             {selectedProject ? (
               isTracking ? (
@@ -655,9 +633,9 @@ const DashboardLayout = () => {
       {/* Layout Body */}
       <div className={`flex ${!isTracking ? "max-h-screen min-h-screen" : " h-[calc(100vh-3rem)]"} bg-base-200 overflow-hidden`}>
         {/* Sidebar */}
-        <aside className="w-20 bg-base-100 border-r border-base-300 flex flex-col items-center py-4 space-y-4">
-          {menuItems.map((item , index) => (
-            <div className="tooltip z-100 tooltip-right" key={item.label} data-tip={item.label}>
+        <aside className="w-20 bg-base-100 border-r border-base-300 flex-shrink-0 flex flex-col items-center py-4 space-y-4">
+          {menuItems.map((item, index) => (
+            <div className="tooltip z-100 tooltip-right" data-tip={item.label} key={index}>
               <NavLink
                 key={item.label}
                 to={item.path}

src/ui/pages/Dashboard.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from "react";
+import React from "react";
 import { Clock, TrendingUp, Play, Square, ProjectorIcon, Pause } from "lucide-react";
 import { useOutletContext } from "react-router-dom";
 import NoData from "./NoData";
@@ -92,14 +92,6 @@ const Dashboard: React.FC = () => {
     projectsData,
   } = useOutletContext<TrackingState>();
 
-  // interface AppsListInt {
-  //   name: string;
-  //   pid: string;
-  //   title: string;
-  // }
-
-  // const [runningApps, setRunningApps] = useState<AppsListInt[]>([]);
-
   const selectedData = selectedProject
     ? projectTrackingMap.get(selectedProject.projectId)
     : null;

types.d.ts

@@ -99,8 +99,6 @@ interface Window {
     getActiveAppDetails: () => {};
     toggleCloseBtn: (shouldEnable: boolean) => {},
     resizeWindow: (width: number, height: number) => {},
-    getRunningApps: () => {},
-    captureAppScreenShot: (appTitle: string) => Promise<string>,
     onWindowUpdate: (callback: (data: any) => void) => void;
     getProjectList: () => Promise<ProjectListResponse>;
     startProjectTracking: (data: {