@optifye/dashboard-core 6.9.2 → 6.9.5

package/dist/index.mjs

@@ -2058,6 +2058,59 @@ var workspaceService = {
       console.error("Error updating shift configuration:", error);
       throw error;
     }
+  },
+  /**
+   * Fetch bulk targets data for multiple lines and shifts in a single API call
+   * This replaces 120+ individual API calls with 1 optimized call
+   *
+   * @param params - Parameters for the bulk fetch
+   * @returns Promise with complete targets data for all lines and shifts
+   */
+  async fetchBulkTargets(params) {
+    try {
+      const token = await getAuthToken();
+      const apiUrl = getBackendUrl();
+      const {
+        companyId,
+        lineIds,
+        date,
+        shifts = [0, 1],
+        includeSkus = true,
+        includeActions = true
+      } = params;
+      const queryParams = new URLSearchParams({
+        company_id: companyId,
+        line_ids: lineIds.join(","),
+        date,
+        shifts: shifts.join(","),
+        include_skus: includeSkus.toString(),
+        include_actions: includeActions.toString()
+      });
+      const response = await fetch(
+        `${apiUrl}/api/targets/bulk-load?${queryParams}`,
+        {
+          method: "GET",
+          headers: {
+            "Authorization": `Bearer ${token}`,
+            "Content-Type": "application/json"
+          }
+        }
+      );
+      if (!response.ok) {
+        const errorText = await response.text();
+        throw new Error(`Backend API error (${response.status}): ${errorText}`);
+      }
+      const data = await response.json();
+      console.log("[fetchBulkTargets] Success:", {
+        lineCount: data.metadata?.line_count,
+        totalWorkspaces: data.metadata?.total_workspaces,
+        timestamp: data.metadata?.timestamp
+      });
+      return data;
+    } catch (error) {
+      console.error("Error fetching bulk targets:", error);
+      throw error;
+    }
   }
 };
 var WorkspaceHealthService = class _WorkspaceHealthService {
@@ -5792,60 +5845,32 @@ var UserManagementService = class {
     }
   }
   /**
-   * Deactivate a user
-   * @param input - Deactivation input
+   * Permanently delete a user
+   * @param userId - The ID of the user to delete
+   * @returns Promise with deletion response
    */
-  async deactivateUser(input) {
+  async deleteUser(userId) {
     try {
       const token = await this.getAuthToken();
       const backendUrl = this.getBackendUrl();
       const response = await fetch(
-        `${backendUrl}/api/users/deactivate`,
-        {
-          method: "POST",
-          headers: {
-            "Authorization": `Bearer ${token}`,
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify(input)
-        }
-      );
-      if (!response.ok) {
-        const errorData = await response.json();
-        throw new Error(`Failed to deactivate user: ${errorData.detail || response.statusText}`);
-      }
-      console.log("[UserManagementService] User deactivated successfully");
-    } catch (error) {
-      console.error("[UserManagementService] Error deactivating user:", error);
-      throw error;
-    }
-  }
-  /**
-   * Reactivate a user
-   * @param input - Reactivation input
-   */
-  async reactivateUser(input) {
-    try {
-      const token = await this.getAuthToken();
-      const backendUrl = this.getBackendUrl();
-      const response = await fetch(
-        `${backendUrl}/api/users/reactivate`,
+        `${backendUrl}/api/users/${userId}`,
         {
-          method: "POST",
+          method: "DELETE",
           headers: {
-            "Authorization": `Bearer ${token}`,
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify(input)
+            "Authorization": `Bearer ${token}`
+          }
         }
       );
       if (!response.ok) {
         const errorData = await response.json();
-        throw new Error(`Failed to reactivate user: ${errorData.detail || response.statusText}`);
+        throw new Error(`Failed to delete user: ${errorData.detail || response.statusText}`);
       }
-      console.log("[UserManagementService] User reactivated successfully");
+      const result = await response.json();
+      console.log("[UserManagementService] User permanently deleted:", result);
+      return result;
     } catch (error) {
-      console.error("[UserManagementService] Error reactivating user:", error);
+      console.error("[UserManagementService] Error deleting user:", error);
       throw error;
     }
   }
@@ -7658,7 +7683,7 @@ var useLeaderboardMetrics = (date, shiftId, limit = 10, filter2 = "all") => {
     refetch: fetchLeaderboard
   };
 };
-var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
+var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds }) => {
   const { supabaseUrl, supabaseKey } = useDashboardConfig();
   const entityConfig = useEntityConfig();
   const databaseConfig = useDatabaseConfig();
@@ -7703,7 +7728,7 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
     try {
       const currentShiftDetails = getCurrentShift(defaultTimezone, shiftConfig);
       const operationalDate = getOperationalDate(defaultTimezone);
-      const targetLineIds = currentLineIdToUse === (entityConfig.factoryViewId || "factory") ? getConfiguredLineIds(entityConfig) : [currentLineIdToUse];
+      const targetLineIds = currentLineIdToUse === (entityConfig.factoryViewId || "factory") ? userAccessibleLineIds || getConfiguredLineIds(entityConfig) : [currentLineIdToUse];
       if (targetLineIds.length === 0 && currentLineIdToUse === (entityConfig.factoryViewId || "factory")) {
         throw new Error("Factory view selected, but no lines are configured in entityConfig.");
       }
@@ -7829,7 +7854,7 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
     }
     const currentShiftDetails = getCurrentShift(defaultTimezone, shiftConfig);
     const operationalDateForSubscription = getOperationalDate(defaultTimezone);
-    const targetLineIds = currentLineIdToUse === (entityConfig.factoryViewId || "factory") ? getConfiguredLineIds(entityConfig) : [currentLineIdToUse];
+    const targetLineIds = currentLineIdToUse === (entityConfig.factoryViewId || "factory") ? userAccessibleLineIds || getConfiguredLineIds(entityConfig) : [currentLineIdToUse];
     if (targetLineIds.length === 0) return;
     const wsMetricsFilter = `line_id=in.(${targetLineIds.map((id3) => `"${id3}"`).join(",")})`;
     const lineMetricsFilter = `line_id=in.(${targetLineIds.map((id3) => `"${id3}"`).join(",")})`;
@@ -7867,7 +7892,8 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId }) => {
     entityConfig?.companyId,
     entityConfig?.factoryViewId,
     defaultTimezone,
-    lineId
+    lineId,
+    userAccessibleLineIds
   ]);
   return {
     workspaceMetrics: metrics2?.workspaceMetrics || [],
@@ -9857,7 +9883,8 @@ var useAllWorkspaceMetrics = (options) => {
     }
     setError(null);
     try {
-      const configuredLineIds = getConfiguredLineIds(entityConfig);
+      const allConfiguredLineIds = getConfiguredLineIds(entityConfig);
+      const configuredLineIds = options?.allowedLineIds ? allConfiguredLineIds.filter((id3) => options.allowedLineIds.includes(id3)) : allConfiguredLineIds;
       let enabledWorkspaceIds = [];
       for (const lineId of configuredLineIds) {
         const workspaces2 = await workspaceService.getWorkspaces(lineId);
@@ -9920,7 +9947,7 @@ var useAllWorkspaceMetrics = (options) => {
       setLoading(false);
       isFetchingRef.current = false;
     }
-  }, [queryDate, queryShiftId, metricsTable, supabase, entityConfig.companyId]);
+  }, [queryDate, queryShiftId, metricsTable, supabase, entityConfig.companyId, entityConfig, options?.allowedLineIds]);
   useEffect(() => {
     if (!initialized) {
       fetchWorkspaceMetrics();
@@ -24305,6 +24332,7 @@ var VideoCard = React23__default.memo(({
   useRAF = true,
   className = "",
   compact = false,
+  displayName,
   onMouseEnter,
   onMouseLeave
 }) => {
@@ -24326,7 +24354,7 @@ var VideoCard = React23__default.memo(({
       onFatalError: onFatalError ?? (() => throttledReloadDashboard())
     });
   }
-  const displayName = getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
+  const workspaceDisplayName = displayName || getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
   const getEfficiencyOverlayColor = (efficiency) => {
     if (efficiency >= 80) {
       return "bg-[#00D654]/25";
@@ -24419,7 +24447,7 @@ var VideoCard = React23__default.memo(({
         /* @__PURE__ */ jsxs("div", { className: `absolute bottom-0 left-0 right-0 bg-black bg-opacity-60 p-1.5 sm:${compact ? "p-1" : "p-1.5"} flex justify-between items-center z-10`, children: [
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
             /* @__PURE__ */ jsx(Camera, { size: compact ? 10 : 12, className: "text-white" }),
-            /* @__PURE__ */ jsx("p", { className: `text-white text-[11px] sm:${compact ? "text-[10px]" : "text-xs"} font-medium tracking-wide`, children: displayName })
+            /* @__PURE__ */ jsx("p", { className: `text-white text-[11px] sm:${compact ? "text-[10px]" : "text-xs"} font-medium tracking-wide`, children: workspaceDisplayName })
           ] }),
           /* @__PURE__ */ jsxs("div", { className: `flex items-center ${compact ? "gap-1" : "gap-1.5"}`, children: [
             trendInfo && /* @__PURE__ */ jsx(
@@ -24456,6 +24484,7 @@ var VideoGridView = React23__default.memo(({
   selectedLine,
   className = "",
   videoSources = {},
+  displayNames = {},
   onWorkspaceHover,
   onWorkspaceHoverEnd
 }) => {
@@ -24670,6 +24699,7 @@ var VideoGridView = React23__default.memo(({
                 isVeryLowEfficiency,
                 cropping: workspaceCropping,
                 canvasFps: canvasConfig?.fps,
+                displayName: displayNames[workspace.workspace_name] || workspace.workspace_name,
                 useRAF: canvasConfig?.useRAF,
                 compact: !selectedLine,
                 onMouseEnter: onWorkspaceHover ? () => onWorkspaceHover(workspaceId) : void 0,
@@ -24687,6 +24717,7 @@ VideoGridView.displayName = "VideoGridView";
 var MapGridView = React23__default.memo(({
   workspaces,
   className = "",
+  displayNames = {},
   onWorkspaceHover,
   onWorkspaceHoverEnd
 }) => {
@@ -24717,10 +24748,10 @@ var MapGridView = React23__default.memo(({
       efficiency: workspace.efficiency,
       action_count: workspace.action_count
     });
-    const displayName = getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
+    const displayName = displayNames[workspace.workspace_name] || getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
     const navParams = getWorkspaceNavigationParams(workspaceId, displayName, workspace.line_id);
     router.push(`/workspace/${workspaceId}${navParams}`);
-  }, [router]);
+  }, [router, displayNames]);
   const activePositions = useMemo(() => {
     return workspacePositions.filter((pos) => {
       const wsKey = pos.id.toUpperCase();
@@ -24746,7 +24777,7 @@ var MapGridView = React23__default.memo(({
           if (!workspace) return null;
           const workspaceId = workspace.workspace_uuid || workspace.workspace_name;
           getPerformanceColor(workspace.efficiency);
-          const displayName = getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
+          const workspaceDisplayName = displayNames[workspace.workspace_name] || getWorkspaceDisplayName(workspace.workspace_name, workspace.line_id);
           return /* @__PURE__ */ jsx(
             motion.div,
             {
@@ -24772,7 +24803,7 @@ var MapGridView = React23__default.memo(({
                   ${position.size === "conveyor" ? "w-32 h-24" : position.size === "large" ? "w-40 h-32" : "w-36 h-28"}
                 `,
                   children: [
-                    /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 px-2 py-1.5 border-b border-gray-200", children: /* @__PURE__ */ jsx("div", { className: "text-xs font-bold text-gray-800 truncate text-center leading-tight", children: displayName }) }),
+                    /* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 right-0 px-2 py-1.5 border-b border-gray-200", children: /* @__PURE__ */ jsx("div", { className: "text-xs font-bold text-gray-800 truncate text-center leading-tight", children: workspaceDisplayName }) }),
                     /* @__PURE__ */ jsx("div", { className: "absolute bottom-0 left-0 right-0 px-2 py-2", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center", children: /* @__PURE__ */ jsxs("div", { className: "text-2xl font-bold text-gray-900", children: [
                       Math.round(workspace.efficiency),
                       "%"
@@ -34800,6 +34831,7 @@ var WorkspaceGrid = React23__default.memo(({
   line2Uuid = "line-2",
   className = "",
   videoSources = {},
+  displayNames = {},
   onWorkspaceHover,
   onWorkspaceHoverEnd
 }) => {
@@ -34865,6 +34897,7 @@ var WorkspaceGrid = React23__default.memo(({
           {
             workspaces,
             videoSources,
+            displayNames,
             onWorkspaceHover,
             onWorkspaceHoverEnd
           }
@@ -34883,6 +34916,7 @@ var WorkspaceGrid = React23__default.memo(({
           MapGridViewComponent,
           {
             workspaces,
+            displayNames,
             onWorkspaceHover,
             onWorkspaceHoverEnd
           }
@@ -41419,7 +41453,6 @@ function HomeView({
   factoryName = "Simba Beer - Line 1"
 }) {
   const [isHydrated, setIsHydrated] = useState(false);
-  const availableLineIds = useMemo(() => [factoryViewId, ...allLineIds], [factoryViewId, allLineIds]);
   const [selectedLineId, setSelectedLineId] = useState(factoryViewId);
   const [isChangingFilter, setIsChangingFilter] = useState(false);
   const [errorMessage, setErrorMessage] = useState(null);
@@ -41429,6 +41462,21 @@ function HomeView({
   const entityConfig = useEntityConfig();
   const supabaseClient = useSupabaseClient();
   const { user } = useAuth();
+  const isSupervisor = user?.role_level === "supervisor";
+  const hasMultipleLines = allLineIds.length > 1;
+  const availableLineIds = useMemo(() => {
+    if (isSupervisor && !hasMultipleLines) {
+      return allLineIds;
+    }
+    return [factoryViewId, ...allLineIds];
+  }, [factoryViewId, allLineIds, isSupervisor, hasMultipleLines]);
+  useEffect(() => {
+    if (user) {
+      if (isSupervisor && allLineIds.length > 0) {
+        setSelectedLineId(allLineIds[0]);
+      }
+    }
+  }, [user, isSupervisor, allLineIds]);
   const userCompanyId = useMemo(() => {
     return user?.properties?.company_id || user?.company_id || entityConfig.companyId;
   }, [user, entityConfig.companyId]);
@@ -41463,7 +41511,7 @@ function HomeView({
     displayNames: workspaceDisplayNames,
     loading: displayNamesLoading,
     error: displayNamesError
-  } = useWorkspaceDisplayNames(void 0, selectedLineId);
+  } = useWorkspaceDisplayNames(selectedLineId, void 0);
   useCallback(() => {
     console.log("Refetching KPIs after line metrics update");
   }, []);
@@ -41489,7 +41537,9 @@ function HomeView({
     refetch: refetchMetrics
   } = useDashboardMetrics({
     lineId: selectedLineId,
-    onLineMetricsUpdate
+    onLineMetricsUpdate,
+    userAccessibleLineIds: allLineIds
+    // Pass user's accessible lines for supervisor filtering
   });
   const {
     activeBreaks: allActiveBreaks,
@@ -41825,7 +41875,7 @@ function HomeView({
       /* @__PURE__ */ jsx(SelectContent, { className: "z-50 bg-white shadow-lg border border-gray-200 rounded-md text-xs sm:text-sm", children: availableLineIds.map((id3) => /* @__PURE__ */ jsx(SelectItem, { value: id3, children: lineNames[id3] || (id3 === factoryViewId ? "All Lines" : `Line ${id3.substring(0, 4)}`) }, id3)) })
     ] });
   }, [availableLineIds, handleLineChange, selectedLineId, lineNames, factoryViewId, allLineIds.length]);
-  const isInitialLoading = !isHydrated || !displayNamesInitialized && displayNamesLoading;
+  const isInitialLoading = !isHydrated || displayNamesLoading || !displayNamesInitialized && displayNamesLoading;
   const isDataLoading = metricsLoading || kpisLoading;
   if (isInitialLoading) {
     return /* @__PURE__ */ jsx(LoadingPageCmp, { message: "Loading Dashboard..." });
@@ -41870,6 +41920,7 @@ function HomeView({
                   lineNames,
                   factoryView: factoryViewId,
                   videoSources,
+                  displayNames: workspaceDisplayNames,
                   className: "h-full",
                   onWorkspaceHover: handleWorkspaceHover,
                   onWorkspaceHoverEnd: handleWorkspaceHoverEnd
@@ -41897,6 +41948,7 @@ function HomeView({
                   lineNames,
                   factoryView: factoryViewId,
                   videoSources,
+                  displayNames: workspaceDisplayNames,
                   className: "h-full",
                   onWorkspaceHover: handleWorkspaceHover,
                   onWorkspaceHoverEnd: handleWorkspaceHoverEnd
@@ -43548,7 +43600,8 @@ var LeaderboardDetailView = memo(({
   line1Id = "",
   line2Id = "",
   lineNames = {},
-  className = ""
+  className = "",
+  userAccessibleLineIds
 }) => {
   const navigation = useNavigation();
   const entityConfig = useEntityConfig();
@@ -43588,7 +43641,9 @@ var LeaderboardDetailView = memo(({
     refreshWorkspaces
   } = useAllWorkspaceMetrics({
     initialDate: date,
-    initialShiftId: typeof shift === "number" ? shift : typeof shift === "string" ? parseInt(shift) : void 0
+    initialShiftId: typeof shift === "number" ? shift : typeof shift === "string" ? parseInt(shift) : void 0,
+    allowedLineIds: userAccessibleLineIds
+    // Filter to user's accessible lines only
   });
   const getShiftName = useCallback((shiftId2) => {
     if (shiftId2 === void 0) return "Day";
@@ -44944,12 +44999,17 @@ var ACTION_NAMES = {
 var calculatePPH = (cycleTime, breaks = [], shiftHours = 0) => {
   if (cycleTime === "" || cycleTime === 0) return "";
   const pph = 3600 / cycleTime;
-  return Number(pph.toFixed(1));
+  return Math.round(pph);
 };
 var calculateDayOutput = (pph, shiftHours, breaks = []) => {
   if (pph === "") return "";
   return Math.round(pph * shiftHours);
 };
+var calculateDayOutputFromCycleTime = (cycleTime, shiftHours) => {
+  if (cycleTime === "" || cycleTime === 0 || shiftHours === 0) return "";
+  const dayOutput = 3600 / cycleTime * shiftHours;
+  return Math.round(dayOutput);
+};
 var formatWorkspaceName = (name, lineId) => {
   return getWorkspaceDisplayName(name, lineId);
 };
@@ -44961,20 +45021,6 @@ var getStoredLineState2 = (lineId) => {
     return false;
   }
 };
-var calculateShiftHours2 = (startTime, endTime, breaks = []) => {
-  if (!startTime || !endTime) return 8;
-  const [startHour, startMinute] = startTime.split(":").map(Number);
-  const [endHour, endMinute] = endTime.split(":").map(Number);
-  let startMinutes = startHour * 60 + startMinute;
-  let endMinutes = endHour * 60 + endMinute;
-  if (endMinutes < startMinutes) {
-    endMinutes += 24 * 60;
-  }
-  const safeBreaks = Array.isArray(breaks) ? breaks : [];
-  const totalBreakMinutes = safeBreaks.reduce((total, breakItem) => total + breakItem.duration, 0);
-  const hoursDiff = (endMinutes - startMinutes - totalBreakMinutes) / 60;
-  return Number(hoursDiff.toFixed(1));
-};
 var BulkConfigureModal = ({
   isOpen,
   onClose,
@@ -46182,121 +46228,6 @@ var TargetsView = ({
   const dashboardConfig = useDashboardConfig();
   const { skus, isLoading: skusLoading } = useSKUs(companyId);
   const skuEnabled = dashboardConfig?.skuConfig?.enabled || false;
-  const loadOperatingHours = useCallback(async (lineId, shiftId) => {
-    try {
-      const { data: { session } } = await supabase.auth.getSession();
-      if (!session?.access_token) {
-        console.error("No authentication token available");
-        return {
-          startTime: "08:00",
-          // Default values
-          endTime: "19:00",
-          breaks: []
-        };
-      }
-      const backendUrl = process.env.NEXT_PUBLIC_BACKEND_URL;
-      if (!backendUrl) {
-        console.error("Backend URL is not configured");
-        return {
-          startTime: "08:00",
-          // Default values
-          endTime: "19:00",
-          breaks: []
-        };
-      }
-      const response = await fetch(`${backendUrl}/api/lines/${lineId}/operating-hours?shift_id=${shiftId}`, {
-        headers: {
-          "Authorization": `Bearer ${session.access_token}`,
-          "Content-Type": "application/json"
-        }
-      });
-      if (!response.ok) {
-        console.log(`No operating hours found for line ${lineId}, shift ${shiftId} - using defaults`);
-        return {
-          startTime: "08:00",
-          // Default values
-          endTime: "19:00",
-          breaks: []
-        };
-      }
-      const data = await response.json();
-      let breaks = [];
-      if (data?.breaks) {
-        if (Array.isArray(data.breaks)) {
-          breaks = data.breaks.map((breakItem) => {
-            const startTime = breakItem.start || breakItem.startTime || "00:00";
-            const endTime = breakItem.end || breakItem.endTime || "00:00";
-            const calculateDuration = (start, end) => {
-              const [startHour, startMinute] = start.split(":").map(Number);
-              const [endHour, endMinute] = end.split(":").map(Number);
-              let startMinutes = startHour * 60 + startMinute;
-              let endMinutes = endHour * 60 + endMinute;
-              if (endMinutes < startMinutes) {
-                endMinutes += 24 * 60;
-              }
-              return endMinutes - startMinutes;
-            };
-            return {
-              startTime,
-              endTime,
-              duration: breakItem.duration || calculateDuration(startTime, endTime)
-            };
-          });
-        } else if (typeof data.breaks === "object" && data.breaks.breaks) {
-          breaks = data.breaks.breaks.map((breakItem) => {
-            const startTime = breakItem.start || breakItem.startTime || "00:00";
-            const endTime = breakItem.end || breakItem.endTime || "00:00";
-            const calculateDuration = (start, end) => {
-              const [startHour, startMinute] = start.split(":").map(Number);
-              const [endHour, endMinute] = end.split(":").map(Number);
-              let startMinutes = startHour * 60 + startMinute;
-              let endMinutes = endHour * 60 + endMinute;
-              if (endMinutes < startMinutes) {
-                endMinutes += 24 * 60;
-              }
-              return endMinutes - startMinutes;
-            };
-            return {
-              startTime,
-              endTime,
-              duration: breakItem.duration || calculateDuration(startTime, endTime)
-            };
-          });
-        } else if (typeof data.breaks === "string") {
-          try {
-            const parsedBreaks = JSON.parse(data.breaks);
-            if (Array.isArray(parsedBreaks)) {
-              breaks = parsedBreaks.map((breakItem) => ({
-                startTime: breakItem.start || breakItem.startTime || "00:00",
-                endTime: breakItem.end || breakItem.endTime || "00:00",
-                duration: breakItem.duration || 0
-              }));
-            } else if (parsedBreaks.breaks && Array.isArray(parsedBreaks.breaks)) {
-              breaks = parsedBreaks.breaks.map((breakItem) => ({
-                startTime: breakItem.start || breakItem.startTime || "00:00",
-                endTime: breakItem.end || breakItem.endTime || "00:00",
-                duration: breakItem.duration || 0
-              }));
-            }
-          } catch (e) {
-            console.error("Error parsing breaks data:", e);
-          }
-        }
-      }
-      return {
-        startTime: data?.start_time || "08:00",
-        endTime: data?.end_time || "19:00",
-        breaks
-      };
-    } catch (e) {
-      console.error("Exception when loading operating hours:", e);
-      return {
-        startTime: "08:00",
-        endTime: "19:00",
-        breaks: []
-      };
-    }
-  }, [supabase]);
   useEffect(() => {
     console.log("[TargetsView] Component mounted/re-rendered", {
       timestamp: (/* @__PURE__ */ new Date()).toISOString(),
@@ -46308,221 +46239,108 @@ var TargetsView = ({
     };
   }, []);
   useEffect(() => {
-    let timeoutId;
-    let retryCount = 0;
-    const MAX_RETRIES2 = 2;
-    const LOADING_TIMEOUT = 15e3;
     const fetchInitialData = async () => {
-      if (lineIds.length === 0) return;
-      console.log("[TargetsView] Starting fetchInitialData");
+      if (lineIds.length === 0 || !companyId) return;
+      console.log("[TargetsView] Starting optimized fetchInitialData with bulk endpoint");
       setIsLoading(true);
-      timeoutId = setTimeout(() => {
-        console.error("Loading timeout reached");
-        if (retryCount < MAX_RETRIES2) {
-          retryCount++;
-          console.log(`Retrying... (attempt ${retryCount + 1}/${MAX_RETRIES2 + 1})`);
-          toast.warning("Loading is taking longer than expected. Retrying...");
-          fetchInitialData();
-        } else {
-          setIsLoading(false);
-          toast.error("Failed to load data. Please refresh the page.");
-        }
-      }, LOADING_TIMEOUT);
       try {
-        const { data: { session } } = await supabase.auth.getSession();
-        if (!session?.access_token) {
-          throw new Error("No authentication token available");
-        }
-        const backendUrl = process.env.NEXT_PUBLIC_BACKEND_URL;
-        if (!backendUrl) {
-          throw new Error("Backend URL is not configured");
+        const currentDate = getOperationalDate(timezone);
+        const bulkResponse = await workspaceService.fetchBulkTargets({
+          companyId,
+          lineIds,
+          date: currentDate,
+          shifts: [0, 1],
+          // Fetch both shifts at once
+          includeSkus: skuEnabled,
+          includeActions: true
+        });
+        if (!bulkResponse.success) {
+          throw new Error("Failed to fetch bulk targets data");
         }
-        const [linesResponse, actions] = await Promise.all([
-          // Fetch lines data (includes factory_id)
-          Promise.all(lineIds.map(async (lineId) => {
-            try {
-              const response = await fetch(`${backendUrl}/api/lines/${lineId}`, {
-                headers: {
-                  "Authorization": `Bearer ${session.access_token}`,
-                  "Content-Type": "application/json"
-                }
-              });
-              if (!response.ok) {
-                console.error(`Error fetching line data for ${lineId}:`, response.statusText);
-                return { lineId, factoryId: void 0 };
-              }
-              const lineData = await response.json();
-              return { lineId, factoryId: lineData.factory_id };
-            } catch (err) {
-              console.error(`Exception fetching line data for ${lineId}:`, err);
-              return { lineId, factoryId: void 0 };
-            }
-          })),
-          // Fetch action IDs
-          actionService.getActionsByName(
-            [ACTION_NAMES.ASSEMBLY, ACTION_NAMES.PACKAGING],
-            companyId
-          )
-        ]);
-        const factoryResults = linesResponse;
-        const assemblyAction = actions.find((a) => a.action_name === ACTION_NAMES.ASSEMBLY);
-        const packagingAction = actions.find((a) => a.action_name === ACTION_NAMES.PACKAGING);
+        const { data } = bulkResponse;
+        const assemblyAction = Object.values(data.actions).find((a) => a.action_name === ACTION_NAMES.ASSEMBLY);
+        const packagingAction = Object.values(data.actions).find((a) => a.action_name === ACTION_NAMES.PACKAGING);
         if (!assemblyAction || !packagingAction) {
-          throw new Error("Could not find required actions");
+          throw new Error("Could not find required actions in bulk response");
         }
         const actionIdsData = {
           assembly: assemblyAction.id,
           packaging: packagingAction.id
         };
         setActionIds(actionIdsData);
-        const updatedLineWorkspaces = { ...initialLineWorkspaces };
-        factoryResults.forEach((result) => {
-          if (result.factoryId && updatedLineWorkspaces[result.lineId]) {
-            updatedLineWorkspaces[result.lineId].factoryId = result.factoryId;
-          }
-        });
-        const currentDate = getOperationalDate(timezone);
-        for (const lineId of lineIds) {
-          if (!updatedLineWorkspaces[lineId]?.factoryId) {
-            console.warn(`Skipping workspace fetch for line ${lineId} - no factory ID`);
-            continue;
-          }
-          try {
-            const workspacesData = await workspaceService.getWorkspaces(lineId);
-            const enabledWorkspaces = workspacesData.filter((ws) => ws.enable === true);
-            const actionThresholds = await workspaceService.getActionThresholds(
-              lineId,
-              currentDate,
-              0
-              // Always use day shift for initial load
-            );
-            const operatingHoursData = await loadOperatingHours(lineId, 0);
-            if (operatingHoursData) {
-              updatedLineWorkspaces[lineId].shiftStartTime = operatingHoursData.startTime;
-              updatedLineWorkspaces[lineId].shiftEndTime = operatingHoursData.endTime;
-              updatedLineWorkspaces[lineId].breaks = operatingHoursData.breaks;
-              updatedLineWorkspaces[lineId].shiftHours = calculateShiftHours2(
-                operatingHoursData.startTime,
-                operatingHoursData.endTime,
-                operatingHoursData.breaks
-              );
+        const newAllShiftsData = { 0: {}, 1: {} };
+        const newDbValues = { 0: {}, 1: {} };
+        Object.entries(data.lines).forEach(([lineId, lineData]) => {
+          [0, 1].forEach((shiftId) => {
+            const shiftData = lineData.shifts[shiftId.toString()];
+            if (!shiftData) {
+              console.warn(`No shift ${shiftId} data for line ${lineId}`);
+              return;
             }
+            const operatingHours = shiftData.operating_hours || {
+              start_time: "08:00",
+              end_time: "19:00",
+              breaks: [],
+              total_hours: 11
+            };
+            newAllShiftsData[shiftId][lineId] = {
+              productId: "",
+              shiftStartTime: operatingHours.start_time,
+              shiftEndTime: operatingHours.end_time,
+              breaks: operatingHours.breaks,
+              shiftHours: operatingHours.total_hours,
+              workspaces: [],
+              factoryId: lineData.line_info.factory_id
+            };
+            newDbValues[shiftId][lineId] = {};
+            const enabledWorkspaces = lineData.workspaces.filter((ws) => ws.enable === true);
             const mappedWorkspaces = enabledWorkspaces.map((ws) => {
-              const threshold = actionThresholds.find((t) => t.workspace_id === ws.id);
-              if (!dbValues[0][lineId]) {
-                dbValues[0][lineId] = {};
-              }
+              const threshold = shiftData.thresholds.find((t) => t.workspace_id === ws.id);
               if (threshold) {
-                dbValues[0][lineId][ws.id] = {
-                  targetPPH: threshold.pph_threshold,
-                  targetCycleTime: threshold.ideal_cycle_time,
-                  targetDayOutput: threshold.total_day_output
+                newDbValues[shiftId][lineId][ws.id] = {
+                  targetPPH: threshold.pph_threshold ? Math.round(threshold.pph_threshold) : "",
+                  targetCycleTime: threshold.ideal_cycle_time ?? "",
+                  targetDayOutput: threshold.total_day_output ?? ""
                 };
               }
+              let actionType = "assembly";
+              let actionId = actionIdsData.assembly;
+              if (ws.action_id === packagingAction.id || ws.action_type === "packaging") {
+                actionType = "packaging";
+                actionId = packagingAction.id;
+              } else if (ws.action_id === assemblyAction.id || ws.action_type === "assembly") {
+                actionType = "assembly";
+                actionId = assemblyAction.id;
+              }
               return {
                 id: ws.id,
                 name: ws.workspace_id,
-                targetPPH: threshold?.pph_threshold ?? (ws.action_pph_threshold === null ? "" : ws.action_pph_threshold),
-                targetCycleTime: threshold?.ideal_cycle_time ?? (ws.action_cycle_time === null ? "" : ws.action_cycle_time),
-                targetDayOutput: threshold?.total_day_output ?? (ws.action_total_day_output === null ? "" : ws.action_total_day_output),
-                actionType: ws.action_id === actionIdsData.assembly ? "assembly" : ws.action_id === actionIdsData.packaging ? "packaging" : "assembly",
-                actionId: ws.action_id === actionIdsData.assembly ? actionIdsData.assembly : ws.action_id === actionIdsData.packaging ? actionIdsData.packaging : actionIdsData.assembly
+                targetPPH: threshold?.pph_threshold ? Math.round(threshold.pph_threshold) : "",
+                targetCycleTime: threshold?.ideal_cycle_time ?? "",
+                targetDayOutput: threshold?.total_day_output ?? "",
+                actionType,
+                actionId
               };
             }).sort((a, b) => a.name.localeCompare(b.name, void 0, { numeric: true }));
-            updatedLineWorkspaces[lineId].workspaces = mappedWorkspaces;
-          } catch (error) {
-            console.error(`Error fetching workspace data for line ${lineId}:`, error);
-          }
-        }
-        setLineWorkspaces(updatedLineWorkspaces);
-        await fetchAllShiftsData(updatedLineWorkspaces);
+            newAllShiftsData[shiftId][lineId].workspaces = mappedWorkspaces;
+          });
+        });
+        setAllShiftsData(newAllShiftsData);
+        setDbValues(newDbValues);
+        console.log("[TargetsView] Successfully loaded all data with bulk endpoint:", {
+          lineCount: bulkResponse.metadata.line_count,
+          totalWorkspaces: bulkResponse.metadata.total_workspaces,
+          loadTime: "Fast!"
+        });
       } catch (error) {
-        console.error("Error fetching initial data:", error);
-        clearTimeout(timeoutId);
-        if (retryCount < MAX_RETRIES2) {
-          retryCount++;
-          console.log(`Error occurred, retrying... (attempt ${retryCount + 1}/${MAX_RETRIES2 + 1})`);
-          toast.warning("Error loading data. Retrying...");
-          setTimeout(() => fetchInitialData(), 1e3);
-        } else {
-          toast.error("Failed to load initial data");
-          setIsLoading(false);
-        }
+        console.error("[TargetsView] Error fetching bulk data:", error);
+        toast.error("Failed to load targets data. Please refresh the page.");
       } finally {
-        clearTimeout(timeoutId);
-        if (retryCount === 0 || retryCount >= MAX_RETRIES2) {
-          setIsLoading(false);
-        }
+        setIsLoading(false);
       }
     };
     fetchInitialData();
-    return () => {
-      clearTimeout(timeoutId);
-    };
-  }, [lineIds, companyId, loadOperatingHours]);
-  const fetchAllShiftsData = useCallback(async (currentWorkspaces) => {
-    if (!supabase) return;
-    const currentDate = getOperationalDate(timezone);
-    const newAllShiftsData = {
-      0: JSON.parse(JSON.stringify(currentWorkspaces)),
-      // Deep clone for day shift
-      1: JSON.parse(JSON.stringify(currentWorkspaces))
-      // Deep clone for night shift
-    };
-    const newDbValues = { 0: {}, 1: {} };
-    for (const shiftId of [0, 1]) {
-      for (const lineId of lineIds) {
-        try {
-          const operatingHoursData = await loadOperatingHours(lineId, shiftId);
-          if (!operatingHoursData) {
-            console.warn(`No operating hours for line ${lineId}, shift ${shiftId} - using defaults`);
-            continue;
-          }
-          const { startTime, endTime, breaks } = operatingHoursData;
-          const shiftHours = calculateShiftHours2(startTime, endTime, breaks);
-          const actionThresholds = await workspaceService.getActionThresholds(
-            lineId,
-            currentDate,
-            shiftId
-          );
-          if (!newDbValues[shiftId][lineId]) {
-            newDbValues[shiftId][lineId] = {};
-          }
-          const existingLine = newAllShiftsData[shiftId][lineId];
-          if (existingLine) {
-            newAllShiftsData[shiftId][lineId] = {
-              ...existingLine,
-              shiftStartTime: startTime,
-              shiftEndTime: endTime,
-              breaks,
-              shiftHours: Number(shiftHours),
-              workspaces: existingLine.workspaces.map((ws) => {
-                const threshold = actionThresholds.find((t) => t.workspace_id === ws.id);
-                if (threshold) {
-                  newDbValues[shiftId][lineId][ws.id] = {
-                    targetPPH: threshold.pph_threshold,
-                    targetCycleTime: threshold.ideal_cycle_time,
-                    targetDayOutput: threshold.total_day_output
-                  };
-                  return {
-                    ...ws,
-                    targetPPH: threshold.pph_threshold,
-                    targetCycleTime: threshold.ideal_cycle_time,
-                    targetDayOutput: threshold.total_day_output
-                  };
-                }
-                return ws;
-              })
-            };
-          }
-        } catch (error) {
-          console.error(`Error fetching data for line ${lineId}, shift ${shiftId}:`, error);
-        }
-      }
-    }
-    setAllShiftsData(newAllShiftsData);
-    setDbValues(newDbValues);
-  }, [supabase, lineIds, loadOperatingHours]);
+  }, [lineIds, companyId, timezone, skuEnabled]);
   const toggleLineDropdown = useCallback((lineId) => {
     setDropdownStates((prev) => {
       const newIsOpen = !prev[lineId];
@@ -46595,7 +46413,7 @@ var TargetsView = ({
               if (value !== "") {
                 const pph = calculatePPH(value, prev[lineId].breaks, shiftHours);
                 updates.targetPPH = pph;
-                updates.targetDayOutput = calculateDayOutput(pph, shiftHours, prev[lineId].breaks);
+                updates.targetDayOutput = calculateDayOutputFromCycleTime(value, shiftHours);
               } else {
                 updates.targetPPH = "";
                 updates.targetDayOutput = "";
@@ -46713,7 +46531,8 @@ var TargetsView = ({
         action_id: ws.actionId,
         workspace_id: ws.id,
         date: currentDate,
-        pph_threshold: Number(ws.targetPPH) || 0,
+        pph_threshold: ws.targetPPH ? Math.round(Number(ws.targetPPH)) : 0,
+        // Round to whole number
         ideal_cycle_time: Number(ws.targetCycleTime) || 0,
         total_day_output: Number(ws.targetDayOutput) || 0,
         action_name: ws.actionType === "assembly" ? ACTION_NAMES.ASSEMBLY : ACTION_NAMES.PACKAGING,
@@ -46732,7 +46551,8 @@ var TargetsView = ({
         shift_id: selectedShift,
         product_code: lineDataToSave.productId,
         threshold_day_output: packagingWorkspaces.reduce((acc, ws) => acc + (Number(ws.targetDayOutput) || 0), 0),
-        threshold_pph: packagingWorkspaces.reduce((acc, ws) => acc + (Number(ws.targetPPH) || 0), 0),
+        threshold_pph: packagingWorkspaces.reduce((acc, ws) => acc + (ws.targetPPH ? Math.round(Number(ws.targetPPH)) : 0), 0),
+        // Round each PPH value
         ...skuEnabled && lineDataToSave.selectedSKU ? { sku_id: lineDataToSave.selectedSKU.id } : {}
       };
       console.log(`[handleSaveLine] lineThresholdData for upsert on ${lineId}:`, lineThresholdData);
@@ -48484,94 +48304,14 @@ var SupervisorManagementView = ({
   ] });
 };
 var SupervisorManagementView_default = SupervisorManagementView;
-var roleChangeImpacts = {
-  supervisor_to_plant_head: {
-    title: "Supervisor \u2192 Plant Head",
-    warnings: [
-      "Will lose line-specific assignments",
-      "Will need factory assignment",
-      "Will gain ability to manage supervisors",
-      "Will see factory-wide data"
-    ],
-    colorClass: "text-blue-700 bg-blue-50 border-blue-200"
-  },
-  supervisor_to_owner: {
-    title: "Supervisor \u2192 Owner",
-    warnings: [
-      "Will gain full company access",
-      "Will lose line-specific restrictions",
-      "Will be able to manage all users",
-      "Will see all company data"
-    ],
-    colorClass: "text-red-700 bg-red-50 border-red-200"
-  },
-  plant_head_to_supervisor: {
-    title: "Plant Head \u2192 Supervisor",
-    warnings: [
-      "Will lose factory access",
-      "Will lose ability to manage others",
-      "Will need line assignment",
-      "Will only see assigned line data"
-    ],
-    colorClass: "text-orange-700 bg-orange-50 border-orange-200"
-  },
-  plant_head_to_owner: {
-    title: "Plant Head \u2192 Owner",
-    warnings: [
-      "Will gain full company access",
-      "Will lose factory-specific restrictions",
-      "Will be able to manage all users",
-      "Will see all company data"
-    ],
-    colorClass: "text-blue-700 bg-blue-50 border-blue-200"
-  },
-  owner_to_plant_head: {
-    title: "Owner \u2192 Plant Head",
-    warnings: [
-      "Will lose company-wide access",
-      "Will need factory assignment",
-      "Will only manage supervisors",
-      "Will only see factory data"
-    ],
-    colorClass: "text-orange-700 bg-orange-50 border-orange-200"
-  },
-  owner_to_supervisor: {
-    title: "Owner \u2192 Supervisor",
-    warnings: [
-      "Will lose company-wide access",
-      "Will lose ability to manage others",
-      "Will need line assignment",
-      "Will only see assigned line data"
-    ],
-    colorClass: "text-red-700 bg-red-50 border-red-200"
-  },
-  to_optifye: {
-    title: "Promoting to Optifye",
-    warnings: [
-      "Will gain access to ALL companies",
-      "Will be able to manage all users globally",
-      "Will see all data across the platform",
-      "This is the highest privilege level"
-    ],
-    colorClass: "text-purple-700 bg-purple-50 border-purple-200"
-  },
-  from_optifye: {
-    title: "Demoting from Optifye",
-    warnings: [
-      "Will lose access to other companies",
-      "Will only see assigned company data",
-      "Will lose global management capabilities",
-      "Will need appropriate assignments"
-    ],
-    colorClass: "text-red-700 bg-red-50 border-red-200"
-  }
-};
-var getRoleChangeKey = (currentRole, newRole) => {
-  if (currentRole === newRole) return null;
-  if (newRole === "optifye") return "to_optifye";
-  if (currentRole === "optifye") return "from_optifye";
-  const key = `${currentRole}_to_${newRole}`;
-  return roleChangeImpacts[key] ? key : null;
+var getRoleLabel = (role) => {
+  const labels = {
+    "supervisor": "Supervisor",
+    "plant_head": "Plant Head",
+    "owner": "Owner",
+    "optifye": "Optifye Admin"
+  };
+  return labels[role] || role;
 };
 var ChangeRoleDialog = ({
   user,
@@ -48584,8 +48324,6 @@ var ChangeRoleDialog = ({
   const [confirmed, setConfirmed] = useState(false);
   const [isChanging, setIsChanging] = useState(false);
   const roleChanged = selectedRole !== user.role_level;
-  const changeKey = roleChanged ? getRoleChangeKey(user.role_level, selectedRole) : null;
-  const impactInfo = changeKey ? roleChangeImpacts[changeKey] : null;
   const handleNext = () => {
     if (roleChanged) {
       setStep("confirm");
@@ -48605,7 +48343,7 @@ var ChangeRoleDialog = ({
     setStep("select");
     setConfirmed(false);
   };
-  return /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-xl max-w-md w-full mx-4", children: [
+  return /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-2xl max-w-md w-full mx-4 transform transition-all", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-6 border-b border-gray-200", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
         /* @__PURE__ */ jsx("div", { className: "p-2 bg-blue-100 rounded-lg", children: /* @__PURE__ */ jsx(UserCog, { className: "w-5 h-5 text-blue-600" }) }),
@@ -48615,20 +48353,14 @@ var ChangeRoleDialog = ({
         "button",
         {
           onClick: onClose,
-          className: "text-gray-400 hover:text-gray-600 transition-colors",
+          className: "text-gray-400 hover:text-gray-600 transition-colors p-1 hover:bg-gray-100 rounded-lg",
           disabled: isChanging,
+          "aria-label": "Close dialog",
           children: /* @__PURE__ */ jsx(X, { className: "w-5 h-5" })
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "p-6 space-y-6", children: step === "select" ? /* @__PURE__ */ jsxs(Fragment, { children: [
-      roleChanged && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 bg-amber-50 border border-amber-200 rounded-lg", children: [
-        /* @__PURE__ */ jsx(AlertCircle, { className: "w-5 h-5 text-amber-600 mt-0.5 flex-shrink-0" }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx("p", { className: "font-medium text-amber-900 text-sm", children: "Changing roles affects access" }),
-          /* @__PURE__ */ jsx("p", { className: "text-amber-700 text-sm mt-1", children: "Review the impact carefully before confirming." })
-        ] })
-      ] }),
+    /* @__PURE__ */ jsx("div", { className: "p-6 space-y-5", children: step === "select" ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600", children: "User" }),
         /* @__PURE__ */ jsxs("div", { className: "p-3 bg-gray-50 rounded-lg", children: [
@@ -48639,7 +48371,7 @@ var ChangeRoleDialog = ({
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-700", children: "Select new role" }),
         /* @__PURE__ */ jsx("div", { className: "space-y-2", children: availableRoles.map((role) => /* @__PURE__ */ jsxs(
           "label",
@@ -48663,27 +48395,24 @@ var ChangeRoleDialog = ({
           role
         )) })
       ] }),
-      impactInfo && /* @__PURE__ */ jsxs("div", { className: `p-4 border rounded-lg ${impactInfo.colorClass}`, children: [
-        /* @__PURE__ */ jsx("p", { className: "font-medium text-sm mb-2", children: "\u2139\uFE0F Impact of this change:" }),
-        /* @__PURE__ */ jsx("ul", { className: "space-y-1.5 text-sm", children: impactInfo.warnings.map((warning6, idx) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
-          /* @__PURE__ */ jsx("span", { className: "mt-0.5", children: "\u2022" }),
-          /* @__PURE__ */ jsx("span", { children: warning6 })
-        ] }, idx)) })
-      ] })
+      roleChanged && /* @__PURE__ */ jsx("div", { className: "px-3 py-2 bg-gray-50 border border-gray-200 rounded-lg", children: /* @__PURE__ */ jsxs("p", { className: "text-xs text-gray-600", children: [
+        "Changing from ",
+        /* @__PURE__ */ jsx("span", { className: "font-medium text-gray-900", children: getRoleLabel(user.role_level) }),
+        " to ",
+        /* @__PURE__ */ jsx("span", { className: "font-medium text-gray-900", children: getRoleLabel(selectedRole) }),
+        " will modify user permissions."
+      ] }) })
     ] }) : /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-3 p-4 bg-gray-50 rounded-lg", children: [
         /* @__PURE__ */ jsx(RoleBadge, { role: user.role_level }),
         /* @__PURE__ */ jsx(ChevronRight, { className: "w-5 h-5 text-gray-400" }),
         /* @__PURE__ */ jsx(RoleBadge, { role: selectedRole })
       ] }),
-      impactInfo && /* @__PURE__ */ jsxs("div", { className: `p-4 border rounded-lg ${impactInfo.colorClass}`, children: [
-        /* @__PURE__ */ jsx("p", { className: "font-medium text-sm mb-3", children: impactInfo.title }),
-        /* @__PURE__ */ jsx("ul", { className: "space-y-2 text-sm", children: impactInfo.warnings.map((warning6, idx) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
-          /* @__PURE__ */ jsx("span", { className: "mt-0.5", children: "\u2022" }),
-          /* @__PURE__ */ jsx("span", { children: warning6 })
-        ] }, idx)) })
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-600", children: "User" }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-900", children: user.email })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 border border-gray-200 rounded-lg", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-3 border border-gray-200 rounded-lg bg-gray-50", children: [
         /* @__PURE__ */ jsx(
           "input",
           {
@@ -48694,7 +48423,7 @@ var ChangeRoleDialog = ({
             className: "mt-0.5 h-4 w-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500"
           }
         ),
-        /* @__PURE__ */ jsx("label", { htmlFor: "confirm-role-change", className: "text-sm text-gray-700 cursor-pointer", children: "I understand this will change the user's access and responsibilities" })
+        /* @__PURE__ */ jsx("label", { htmlFor: "confirm-role-change", className: "text-sm text-gray-700 cursor-pointer", children: "I confirm this role change and understand the permissions will be updated" })
       ] })
     ] }) }) }),
     /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end gap-3 p-6 border-t border-gray-200 bg-gray-50", children: step === "select" ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -48737,7 +48466,7 @@ var ChangeRoleDialog = ({
               /* @__PURE__ */ jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
             ] }),
             "Changing..."
-          ] }) : "Change Role"
+          ] }) : "Confirm Change"
         }
       )
     ] }) })
@@ -48760,32 +48489,34 @@ var ConfirmRemoveUserDialog = ({
       setIsRemoving(false);
     }
   };
-  return /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-lg shadow-xl max-w-md w-full mx-4", children: [
+  return /* @__PURE__ */ jsx("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-2xl max-w-md w-full mx-4 transform transition-all", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-6 border-b border-gray-200", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
         /* @__PURE__ */ jsx("div", { className: "p-2 bg-red-100 rounded-lg", children: /* @__PURE__ */ jsx(Trash2, { className: "w-5 h-5 text-red-600" }) }),
-        /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900", children: "Remove User" })
+        /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-gray-900", children: "Permanently Delete User" })
       ] }),
       /* @__PURE__ */ jsx(
         "button",
         {
           onClick: onCancel,
-          className: "text-gray-400 hover:text-gray-600 transition-colors",
+          className: "text-gray-400 hover:text-gray-600 transition-colors p-1 hover:bg-gray-100 rounded-lg",
+          disabled: isRemoving,
+          "aria-label": "Close dialog",
           children: /* @__PURE__ */ jsx(X, { className: "w-5 h-5" })
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "p-6 space-y-6", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 bg-red-50 border border-red-200 rounded-lg", children: [
-        /* @__PURE__ */ jsx(AlertTriangle, { className: "w-5 h-5 text-red-600 mt-0.5 flex-shrink-0" }),
-        /* @__PURE__ */ jsxs("div", { children: [
-          /* @__PURE__ */ jsx("p", { className: "font-medium text-red-900 text-sm", children: "This action cannot be undone" }),
-          /* @__PURE__ */ jsx("p", { className: "text-red-700 text-sm mt-1", children: "The user will immediately lose all access to the platform." })
+    /* @__PURE__ */ jsxs("div", { className: "p-6 space-y-5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-3 bg-red-50 border border-red-200 rounded-lg", children: [
+        /* @__PURE__ */ jsx(AlertTriangle, { className: "w-4 h-4 text-red-600 mt-0.5 flex-shrink-0" }),
+        /* @__PURE__ */ jsxs("p", { className: "text-sm text-red-900", children: [
+          /* @__PURE__ */ jsx("span", { className: "font-medium", children: "This action cannot be undone." }),
+          " This will permanently delete the user and all related data from the system."
         ] })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-700", children: "You are about to remove:" }),
-        /* @__PURE__ */ jsxs("div", { className: "p-4 bg-gray-50 rounded-lg space-y-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-700", children: "You are about to permanently delete:" }),
+        /* @__PURE__ */ jsxs("div", { className: "p-3 bg-gray-50 rounded-lg space-y-2.5", children: [
           /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
             /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-600", children: "Email" }),
             /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-gray-900", children: user.email })
@@ -48810,28 +48541,7 @@ var ConfirmRemoveUserDialog = ({
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-gray-700", children: "This will:" }),
-        /* @__PURE__ */ jsxs("ul", { className: "space-y-2 text-sm text-gray-600", children: [
-          /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-red-500 mt-0.5", children: "\u2022" }),
-            /* @__PURE__ */ jsx("span", { children: "Revoke all access immediately" })
-          ] }),
-          /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-red-500 mt-0.5", children: "\u2022" }),
-            /* @__PURE__ */ jsx("span", { children: "Remove all line and factory assignments" })
-          ] }),
-          /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-red-500 mt-0.5", children: "\u2022" }),
-            /* @__PURE__ */ jsx("span", { children: "Log the user out of all sessions" })
-          ] }),
-          /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-2", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-red-500 mt-0.5", children: "\u2022" }),
-            /* @__PURE__ */ jsx("span", { children: "User will not be able to access the dashboard" })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-4 border border-gray-200 rounded-lg", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3 p-3 border border-gray-200 rounded-lg bg-gray-50", children: [
         /* @__PURE__ */ jsx(
           "input",
           {
@@ -48842,7 +48552,7 @@ var ConfirmRemoveUserDialog = ({
             className: "mt-0.5 h-4 w-4 text-red-600 border-gray-300 rounded focus:ring-red-500"
           }
         ),
-        /* @__PURE__ */ jsx("label", { htmlFor: "confirm-remove", className: "text-sm text-gray-700 cursor-pointer", children: "I understand this action is permanent and cannot be undone" })
+        /* @__PURE__ */ jsx("label", { htmlFor: "confirm-remove", className: "text-sm text-gray-700 cursor-pointer", children: "I understand this will permanently delete the user and all related data, and this action cannot be undone" })
       ] })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-3 p-6 border-t border-gray-200 bg-gray-50", children: [
@@ -48866,8 +48576,8 @@ var ConfirmRemoveUserDialog = ({
               /* @__PURE__ */ jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4", fill: "none" }),
               /* @__PURE__ */ jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
             ] }),
-            "Removing..."
-          ] }) : "Remove User"
+            "Deleting..."
+          ] }) : "Delete User"
         }
       )
     ] })
@@ -49290,7 +49000,6 @@ var FactoryAssignmentDropdown = ({
 var UserManagementTable = ({
   users,
   isLoading = false,
-  onUserClick,
   onRoleChange,
   onRemoveUser,
   onLineAssignmentUpdate,
@@ -49316,9 +49025,48 @@ var UserManagementTable = ({
   const [sortField, setSortField] = useState("email");
   const [sortDirection, setSortDirection] = useState("asc");
   const [openActionMenuId, setOpenActionMenuId] = useState(null);
+  const [dropdownPosition, setDropdownPosition] = useState(null);
+  const actionButtonRefs = useRef({});
   const [selectedUser, setSelectedUser] = useState(null);
   const [showChangeRoleDialog, setShowChangeRoleDialog] = useState(false);
   const [showRemoveUserDialog, setShowRemoveUserDialog] = useState(false);
+  const handleOpenActionMenu = (userId) => {
+    const buttonRef = actionButtonRefs.current[userId];
+    if (buttonRef) {
+      const rect = buttonRef.getBoundingClientRect();
+      setDropdownPosition({
+        top: rect.bottom + 8,
+        // 8px below the button
+        left: rect.right - 192
+        // 192px is the dropdown width (w-48 = 12rem = 192px)
+      });
+      setOpenActionMenuId(userId);
+    }
+  };
+  const handleCloseActionMenu = () => {
+    setOpenActionMenuId(null);
+    setDropdownPosition(null);
+  };
+  useEffect(() => {
+    if (openActionMenuId && actionButtonRefs.current[openActionMenuId]) {
+      const updatePosition = () => {
+        const buttonRef = actionButtonRefs.current[openActionMenuId];
+        if (buttonRef) {
+          const rect = buttonRef.getBoundingClientRect();
+          setDropdownPosition({
+            top: rect.bottom + 8,
+            left: rect.right - 192
+          });
+        }
+      };
+      window.addEventListener("scroll", updatePosition, true);
+      window.addEventListener("resize", updatePosition);
+      return () => {
+        window.removeEventListener("scroll", updatePosition, true);
+        window.removeEventListener("resize", updatePosition);
+      };
+    }
+  }, [openActionMenuId]);
   const filteredAndSortedUsers = useMemo(() => {
     let filtered = users;
     filtered = filtered.filter((user) => availableRoles.includes(user.role_level));
@@ -49509,7 +49257,7 @@ var UserManagementTable = ({
                   LineAssignmentDropdown,
                   {
                     userId: user.user_id,
-                    currentLineIds: user.properties?.line_id || [],
+                    currentLineIds: user.properties?.line_ids || [],
                     availableLines: (
                       // Filter lines to only show those from the target user's company
                       (() => {
@@ -49547,69 +49295,24 @@ var UserManagementTable = ({
                   }
                 ) : /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-900", children: formatAssignments(user) }) }),
                 /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap", children: /* @__PURE__ */ jsx("p", { className: "text-sm text-gray-500", children: formatDate(user.created_at) }) }),
-                /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap text-right", children: hasActions && /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-                  /* @__PURE__ */ jsx(
-                    "button",
-                    {
-                      onClick: () => setOpenActionMenuId(openActionMenuId === user.user_id ? null : user.user_id),
-                      className: "p-2 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg transition-colors",
-                      "aria-label": "User actions",
-                      children: /* @__PURE__ */ jsx(MoreVertical, { className: "w-4 h-4" })
-                    }
-                  ),
-                  openActionMenuId === user.user_id && /* @__PURE__ */ jsxs(Fragment, { children: [
-                    /* @__PURE__ */ jsx(
-                      "div",
-                      {
-                        className: "fixed inset-0 z-[9998]",
-                        onClick: () => setOpenActionMenuId(null)
+                /* @__PURE__ */ jsx("td", { className: "px-6 py-4 whitespace-nowrap text-right", children: hasActions && /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    ref: (el) => {
+                      actionButtonRefs.current[user.user_id] = el;
+                    },
+                    onClick: () => {
+                      if (openActionMenuId === user.user_id) {
+                        handleCloseActionMenu();
+                      } else {
+                        handleOpenActionMenu(user.user_id);
                       }
-                    ),
-                    /* @__PURE__ */ jsx("div", { className: "absolute right-0 mt-2 w-48 bg-white rounded-lg shadow-lg border border-gray-200 z-[9999]", children: /* @__PURE__ */ jsxs("div", { className: "py-1", children: [
-                      /* @__PURE__ */ jsxs(
-                        "button",
-                        {
-                          onClick: () => {
-                            onUserClick?.(user);
-                            setOpenActionMenuId(null);
-                          },
-                          className: "w-full px-4 py-2 text-sm text-left text-gray-700 hover:bg-gray-100 flex items-center gap-2",
-                          children: [
-                            /* @__PURE__ */ jsx(Eye, { className: "w-4 h-4" }),
-                            "View Details"
-                          ]
-                        }
-                      ),
-                      canChangeRole && /* @__PURE__ */ jsxs(
-                        "button",
-                        {
-                          onClick: () => handleChangeRole(user),
-                          className: "w-full px-4 py-2 text-sm text-left text-gray-700 hover:bg-gray-100 flex items-center gap-2",
-                          disabled: isCurrentUser,
-                          children: [
-                            /* @__PURE__ */ jsx(UserCog, { className: "w-4 h-4" }),
-                            "Change Role"
-                          ]
-                        }
-                      ),
-                      canRemove && /* @__PURE__ */ jsxs(Fragment, { children: [
-                        /* @__PURE__ */ jsx("div", { className: "border-t border-gray-200 my-1" }),
-                        /* @__PURE__ */ jsxs(
-                          "button",
-                          {
-                            onClick: () => handleRemoveUser(user),
-                            className: "w-full px-4 py-2 text-sm text-left text-red-600 hover:bg-red-50 flex items-center gap-2",
-                            disabled: isCurrentUser,
-                            children: [
-                              /* @__PURE__ */ jsx(Trash2, { className: "w-4 h-4" }),
-                              "Remove User"
-                            ]
-                          }
-                        )
-                      ] })
-                    ] }) })
-                  ] })
-                ] }) })
+                    },
+                    className: "p-2 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-lg transition-colors",
+                    "aria-label": "User actions",
+                    children: /* @__PURE__ */ jsx(MoreVertical, { className: "w-4 h-4" })
+                  }
+                ) }) })
               ]
             },
             user.user_id
@@ -49617,6 +49320,75 @@ var UserManagementTable = ({
         }) })
       ] }) }) })
     ] }),
+    openActionMenuId && dropdownPosition && typeof document !== "undefined" && createPortal(
+      /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "fixed inset-0 z-[9998]",
+            onClick: handleCloseActionMenu
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "fixed w-48 bg-white rounded-lg shadow-lg border border-gray-200 z-[9999]",
+            style: {
+              top: `${dropdownPosition.top}px`,
+              left: `${dropdownPosition.left}px`
+            },
+            children: /* @__PURE__ */ jsxs("div", { className: "py-1", children: [
+              (() => {
+                const user = users.find((u) => u.user_id === openActionMenuId);
+                const isCurrentUser = user?.user_id === currentUserId;
+                const canChangeRole = user && permissions.canChangeRole(user);
+                return canChangeRole && /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    onClick: () => {
+                      if (user) {
+                        handleChangeRole(user);
+                      }
+                    },
+                    className: "w-full px-4 py-2 text-sm text-left text-gray-700 hover:bg-gray-100 flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
+                    disabled: isCurrentUser,
+                    children: [
+                      /* @__PURE__ */ jsx(UserCog, { className: "w-4 h-4" }),
+                      "Change Role"
+                    ]
+                  }
+                );
+              })(),
+              (() => {
+                const user = users.find((u) => u.user_id === openActionMenuId);
+                const isCurrentUser = user?.user_id === currentUserId;
+                const canRemove = user && permissions.canRemoveUser(user);
+                return canRemove && /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx("div", { className: "border-t border-gray-200 my-1" }),
+                  /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onClick: () => {
+                        if (user) {
+                          handleRemoveUser(user);
+                        }
+                      },
+                      className: "w-full px-4 py-2 text-sm text-left text-red-600 hover:bg-red-50 flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
+                      disabled: isCurrentUser,
+                      children: [
+                        /* @__PURE__ */ jsx(Trash2, { className: "w-4 h-4" }),
+                        "Delete User"
+                      ]
+                    }
+                  )
+                ] });
+              })()
+            ] })
+          }
+        )
+      ] }),
+      document.body
+    ),
     showChangeRoleDialog && selectedUser && /* @__PURE__ */ jsx(
       ChangeRoleDialog,
       {
@@ -50268,15 +50040,12 @@ var TeamManagementView = ({
     if (!supabase || !user) return;
     try {
       const userManagementService = createUserManagementService(supabase);
-      await userManagementService.deactivateUser({
-        user_id: userId,
-        deactivated_by: user.id
-      });
-      toast.success("User removed successfully");
+      const result = await userManagementService.deleteUser(userId);
+      toast.success(`User ${result.deleted_user_email} permanently deleted`);
       loadData();
     } catch (err) {
-      console.error("Error removing user:", err);
-      toast.error("Failed to remove user");
+      console.error("Error deleting user:", err);
+      toast.error("Failed to delete user");
     }
   }, [supabase, user, loadData]);
   const handleLineAssignmentUpdate = useCallback(async (userId, lineIds) => {
@@ -50370,9 +50139,6 @@ var TeamManagementView = ({
       {
         users,
         currentUserId: user?.id,
-        onUserClick: (clickedUser) => {
-          console.log("View user details:", clickedUser);
-        },
         onRoleChange: handleRoleChange,
         onRemoveUser: handleRemoveUser,
         onLineAssignmentUpdate: handleLineAssignmentUpdate,