openvsx-webui-test 0.17.2 → 0.18.0-dev.1

package/src/hooks/scan-admin/use-auto-rejected-tab.ts

@@ -0,0 +1,85 @@
+/********************************************************************************
+ * Copyright (c) 2026 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License 2.0 which is available at
+ * https://www.eclipse.org/legal/epl-2.0
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ ********************************************************************************/
+
+import { useMemo } from 'react';
+import { useScanContext } from '../../context/scan-admin';
+import { useScanFilters } from './use-scan-filters';
+import { usePagination } from './use-pagination';
+import { useSearch } from './use-search';
+
+/**
+ * Hook for the Auto Rejected tab (tab index 2).
+ * Provides auto-rejected scan data and validation type filtering.
+ */
+export const useAutoRejectedTab = () => {
+    const { state, actions } = useScanContext();
+    const { globalFilters, validationTypeFilters } = useScanFilters();
+    const pagination = usePagination();
+    const search = useSearch();
+
+    // Use scans directly from state - backend handles filtering based on tab and enforcement
+    const autoRejectedScans = state.scans;
+
+    // Get validation type breakdown
+    const validationTypeBreakdown = useMemo(() => {
+        const breakdown: Record<string, number> = {};
+        autoRejectedScans.forEach(scan => {
+            scan.validationFailures?.forEach(failure => {
+                const type = failure.type || 'Unknown';
+                breakdown[type] = (breakdown[type] || 0) + 1;
+            });
+        });
+        return breakdown;
+    }, [autoRejectedScans]);
+
+    // Get total count from the counts API (unaffected by search filters)
+    const totalCount = (state.scanCounts?.STARTED ?? 0) + (state.scanCounts?.VALIDATING ?? 0) +
+        (state.scanCounts?.SCANNING ?? 0) + (state.scanCounts?.PASSED ?? 0) +
+        (state.scanCounts?.QUARANTINED ?? 0) + (state.scanCounts?.AUTO_REJECTED ?? 0) +
+        (state.scanCounts?.ERROR ?? 0);
+
+    // Check if there are any validation types available to filter by
+    const hasValidationTypes = state.availableValidationTypes.length > 0;
+
+    return useMemo(() => ({
+        tabIndex: 2,
+        tabName: 'Auto Rejected',
+        scans: autoRejectedScans,
+        isLoading: state.isLoadingScans,
+        lastRefreshed: state.lastRefreshed,
+        autoRefresh: state.autoRefresh,
+        onAutoRefreshChange: actions.setAutoRefresh,
+        totalCount,
+        hasValidationTypes,
+        search,
+        globalFilters,
+        validationTypeFilters,
+        pagination,
+        validationTypeBreakdown,
+    }), [
+        autoRejectedScans,
+        state.isLoadingScans,
+        state.lastRefreshed,
+        state.autoRefresh,
+        actions.setAutoRefresh,
+        totalCount,
+        hasValidationTypes,
+        search,
+        globalFilters,
+        validationTypeFilters,
+        pagination,
+        validationTypeBreakdown,
+    ]);
+};
+
+export type UseAutoRejectedTabReturn = ReturnType<typeof useAutoRejectedTab>;

package/src/hooks/scan-admin/use-dialogs.ts

@@ -0,0 +1,83 @@
+/********************************************************************************
+ * Copyright (c) 2026 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License 2.0 which is available at
+ * https://www.eclipse.org/legal/epl-2.0
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ ********************************************************************************/
+
+import { useMemo } from 'react';
+import { useScanContext } from '../../context/scan-admin';
+import { ConfirmActionType, FileActionType, ScanResult, FileDecision } from '../../context/scan-admin/scan-types';
+
+/**
+ * Return type for the useDialogs hook
+ */
+export interface UseDialogsReturn {
+    /** Confirm dialog state and actions (for extension-level allow/block) */
+    confirmDialog: {
+        isOpen: boolean;
+        action: ConfirmActionType;
+        selectedExtensions: ScanResult[];
+        close: () => void;
+        execute: () => void;
+    };
+    /** File dialog state and actions (for file-level allow/block/delete) */
+    fileDialog: {
+        isOpen: boolean;
+        actionType: FileActionType;
+        selectedFiles: FileDecision[];
+        close: () => void;
+        execute: () => void;
+    };
+    openAllowDialog: () => void;
+    openBlockDialog: () => void;
+    openFileDialog: (action: FileActionType) => void;
+}
+
+/**
+ * Hook for dialog state and actions.
+ * Provides a clean interface for dialog components to consume.
+ */
+export const useDialogs = (): UseDialogsReturn => {
+    const { state, actions, derived } = useScanContext();
+
+    return useMemo(() => ({
+        confirmDialog: {
+            isOpen: state.confirmDialogOpen,
+            action: state.confirmAction,
+            selectedExtensions: derived.selectedExtensions,
+            close: actions.closeConfirmDialog,
+            execute: actions.executeConfirmAction,
+        },
+        fileDialog: {
+            isOpen: state.fileDialogOpen,
+            actionType: state.fileActionType,
+            selectedFiles: derived.selectedFiles,
+            close: actions.closeFileDialog,
+            execute: actions.executeFileAction,
+        },
+        openAllowDialog: actions.openAllowDialog,
+        openBlockDialog: actions.openBlockDialog,
+        openFileDialog: actions.openFileDialog,
+    }), [
+        state.confirmDialogOpen,
+        state.confirmAction,
+        state.fileDialogOpen,
+        state.fileActionType,
+        derived.selectedExtensions,
+        derived.selectedFiles,
+        actions.closeConfirmDialog,
+        actions.executeConfirmAction,
+        actions.closeFileDialog,
+        actions.executeFileAction,
+        actions.openAllowDialog,
+        actions.openBlockDialog,
+        actions.openFileDialog,
+    ]);
+};

package/src/hooks/scan-admin/use-file-list-tab.ts

@@ -0,0 +1,149 @@
+/********************************************************************************
+ * Copyright (c) 2026 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License 2.0 which is available at
+ * https://www.eclipse.org/legal/epl-2.0
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ ********************************************************************************/
+
+import { useMemo, useCallback } from 'react';
+import { useScanContext, FileDecisionType } from '../../context/scan-admin';
+import { usePagination } from './use-pagination';
+import { useSearch } from './use-search';
+
+interface UseFileListTabOptions {
+    tabIndex: 3 | 4;
+    decisionType: FileDecisionType;
+    tabName: string;
+}
+
+/**
+ * Hook for the Allowed Files (tab 3) and Blocked Files (tab 4) tabs.
+ * Provides file list data, selection management, and file actions.
+ */
+export const useFileListTab = ({ tabIndex, decisionType, tabName }: UseFileListTabOptions) => {
+    const { state, actions, derived } = useScanContext();
+    const pagination = usePagination();
+    const search = useSearch();
+
+    // Files are already filtered server-side by decision parameter
+    const files = state.files;
+
+    // Auto-refresh state (shared with all tabs)
+    const lastRefreshed = state.lastRefreshed;
+    const autoRefresh = state.autoRefresh;
+    const onAutoRefreshChange = actions.setAutoRefresh;
+
+    // Selection state (files already filtered server-side by decision)
+    const selection = useMemo(() => ({
+        checked: state.filesChecked,
+        selectedCount: state.filesChecked.size,
+        selectedFiles: derived.selectedFiles,
+    }), [state.filesChecked, derived.selectedFiles]);
+
+    // Selection actions
+    const setFilesChecked = useCallback((fileIds: Set<string>) => {
+        actions.setFilesChecked(fileIds);
+    }, [actions]);
+
+    const selectAll = useCallback(() => {
+        const allIds = new Set(files.map(f => f.id));
+        actions.setFilesChecked(allIds);
+    }, [files, actions]);
+
+    const deselectAll = useCallback(() => {
+        actions.setFilesChecked(new Set());
+    }, [actions]);
+
+    const isAllSelected = useMemo(() => {
+        return files.length > 0 && files.every(file => state.filesChecked.has(file.id));
+    }, [files, state.filesChecked]);
+
+    const isSomeSelected = useMemo(() => {
+        return files.some(file => state.filesChecked.has(file.id)) && !isAllSelected;
+    }, [files, state.filesChecked, isAllSelected]);
+
+    // File actions
+    const fileActions = useMemo(() => ({
+        openAllowDialog: () => actions.openFileDialog('allow'),
+        openBlockDialog: () => actions.openFileDialog('block'),
+        openDeleteDialog: () => actions.openFileDialog('delete'),
+        canPerformAction: selection.selectedCount > 0,
+    }), [actions, selection.selectedCount]);
+
+    // Get count from file counts
+    const fileCount = state.fileCounts
+        ? (decisionType === 'allowed' ? state.fileCounts.allowed : state.fileCounts.blocked)
+        : 0;
+
+    return useMemo(() => ({
+        tabIndex,
+        tabName,
+        decisionType,
+        files,
+        isLoading: state.isLoadingFiles,
+        fileCount,
+        lastRefreshed,
+        autoRefresh,
+        onAutoRefreshChange,
+        search,
+        pagination,
+        selection,
+        setFilesChecked,
+        selectAll,
+        deselectAll,
+        isAllSelected,
+        isSomeSelected,
+        fileActions,
+    }), [
+        tabIndex,
+        tabName,
+        decisionType,
+        files,
+        state.isLoadingFiles,
+        fileCount,
+        lastRefreshed,
+        autoRefresh,
+        onAutoRefreshChange,
+        search,
+        pagination,
+        selection,
+        setFilesChecked,
+        selectAll,
+        deselectAll,
+        isAllSelected,
+        isSomeSelected,
+        fileActions,
+    ]);
+};
+
+/**
+ * Hook specifically for the Allow List tab (tab index 3).
+ */
+export const useAllowListTab = () => {
+    return useFileListTab({
+        tabIndex: 3,
+        decisionType: 'allowed',
+        tabName: 'Allow List',
+    });
+};
+
+/**
+ * Hook specifically for the Block List tab (tab index 4).
+ */
+export const useBlockListTab = () => {
+    return useFileListTab({
+        tabIndex: 4,
+        decisionType: 'blocked',
+        tabName: 'Block List',
+    });
+};
+
+export type UseFileListTabReturn = ReturnType<typeof useFileListTab>;
+export type UseAllowListTabReturn = ReturnType<typeof useAllowListTab>;
+export type UseBlockListTabReturn = ReturnType<typeof useBlockListTab>;

package/src/hooks/scan-admin/use-pagination.ts

@@ -0,0 +1,90 @@
+/********************************************************************************
+ * Copyright (c) 2026 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License 2.0 which is available at
+ * https://www.eclipse.org/legal/epl-2.0
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ ********************************************************************************/
+
+import { useMemo, useCallback } from 'react';
+import { useScanContext } from '../../context/scan-admin';
+
+/**
+ * Hook for managing pagination state and actions.
+ * Provides page navigation, total pages calculation, and loading state.
+ */
+export const usePagination = () => {
+    const { state, actions, derived } = useScanContext();
+
+    const goToPage = useCallback((page: number) => {
+        if (page >= 0 && page < derived.totalPages) {
+            actions.setPage(page);
+        }
+    }, [actions, derived.totalPages]);
+
+    const goToNextPage = useCallback(() => {
+        if (state.currentPage < derived.totalPages - 1) {
+            actions.setPage(state.currentPage + 1);
+        }
+    }, [state.currentPage, derived.totalPages, actions]);
+
+    const goToPreviousPage = useCallback(() => {
+        if (state.currentPage > 0) {
+            actions.setPage(state.currentPage - 1);
+        }
+    }, [state.currentPage, actions]);
+
+    const goToFirstPage = useCallback(() => {
+        actions.setPage(0);
+    }, [actions]);
+
+    const goToLastPage = useCallback(() => {
+        if (derived.totalPages > 0) {
+            actions.setPage(derived.totalPages - 1);
+        }
+    }, [derived.totalPages, actions]);
+
+    // Determine if we're in a loading state based on selected tab
+    const isLoading = state.selectedTab >= 3 ? state.isLoadingFiles : state.isLoadingScans;
+
+    // Get total items based on selected tab
+    const totalItems = state.selectedTab >= 3 ? state.totalFiles : state.totalScans;
+
+    return useMemo(() => ({
+        currentPage: state.currentPage,
+        pageSize: state.pageSize,
+        totalPages: derived.totalPages,
+        totalItems,
+        isLoading,
+        goToPage,
+        goToNextPage,
+        goToPreviousPage,
+        goToFirstPage,
+        goToLastPage,
+        hasNextPage: state.currentPage < derived.totalPages - 1,
+        hasPreviousPage: state.currentPage > 0,
+        isFirstPage: state.currentPage === 0,
+        isLastPage: state.currentPage >= derived.totalPages - 1,
+        // Range info (1-indexed for display)
+        startItem: totalItems > 0 ? state.currentPage * state.pageSize + 1 : 0,
+        endItem: Math.min((state.currentPage + 1) * state.pageSize, totalItems),
+    }), [
+        state.currentPage,
+        state.pageSize,
+        derived.totalPages,
+        totalItems,
+        isLoading,
+        goToPage,
+        goToNextPage,
+        goToPreviousPage,
+        goToFirstPage,
+        goToLastPage,
+    ]);
+};
+
+export type UsePaginationReturn = ReturnType<typeof usePagination>;

package/src/hooks/scan-admin/use-quarantined-tab.ts

@@ -0,0 +1,138 @@
+/********************************************************************************
+ * Copyright (c) 2026 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License 2.0 which is available at
+ * https://www.eclipse.org/legal/epl-2.0
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ ********************************************************************************/
+
+import { useMemo, useCallback } from 'react';
+import { useScanContext } from '../../context/scan-admin';
+import { useScanFilters } from './use-scan-filters';
+import { usePagination } from './use-pagination';
+import { useSearch } from './use-search';
+
+/**
+ * Hook for the Quarantined tab (tab index 1).
+ * Provides quarantined scan data, selection management, and bulk actions.
+ */
+export const useQuarantinedTab = () => {
+    const { state, actions, derived } = useScanContext();
+    const { globalFilters, quarantineFilters } = useScanFilters();
+    const pagination = usePagination();
+    const search = useSearch();
+
+    // Scans are already filtered server-side by threatScannerName parameter
+    const quarantinedScans = state.scans;
+
+    // Determine which scans are selectable (need review)
+    // A scan needs review if: no admin decision AND has at least one enforced threat
+    const selectableScans = useMemo(() => {
+        return quarantinedScans.filter(scan => {
+            const hasEnforcedThreat = scan.threats.some(t => t.enforcedFlag);
+            const needsReview = !scan.adminDecision?.decision && hasEnforcedThreat;
+            return needsReview;
+        });
+    }, [quarantinedScans]);
+
+    // Selection state
+    const selection = useMemo(() => {
+        const keys = Object.keys(state.quarantinedChecked);
+        const selectedCount = keys.filter(key => state.quarantinedChecked[key]).length;
+        return {
+            checked: state.quarantinedChecked,
+            selectedCount,
+            selectedExtensions: derived.selectedExtensions,
+        };
+    }, [state.quarantinedChecked, derived.selectedExtensions]);
+
+    // Selection actions
+    const toggleCheck = useCallback((id: string, checked: boolean) => {
+        actions.toggleQuarantinedCheck(id, checked);
+    }, [actions]);
+
+    const selectAll = useCallback(() => {
+        // Only select scans that are selectable (need review)
+        actions.selectAllQuarantined(selectableScans);
+    }, [actions, selectableScans]);
+
+    const deselectAll = useCallback(() => {
+        actions.deselectAllQuarantined();
+    }, [actions]);
+
+    const isAllSelected = useMemo(() => {
+        // Check if all selectable scans are selected
+        return selectableScans.length > 0 &&
+            selectableScans.every(scan => state.quarantinedChecked[scan.id]);
+    }, [selectableScans, state.quarantinedChecked]);
+
+    const isSomeSelected = useMemo(() => {
+        return selectableScans.some(scan => state.quarantinedChecked[scan.id]) &&
+            !isAllSelected;
+    }, [selectableScans, state.quarantinedChecked, isAllSelected]);
+
+    // Bulk actions
+    const bulkActions = useMemo(() => ({
+        openAllowDialog: actions.openAllowDialog,
+        openBlockDialog: actions.openBlockDialog,
+        canPerformBulkAction: selection.selectedCount > 0,
+    }), [actions, selection.selectedCount]);
+
+    // Get total count from the counts API (unaffected by search filters and admin decision checkbox filters)
+    const totalCount = (state.scanCounts?.STARTED ?? 0) + (state.scanCounts?.VALIDATING ?? 0) +
+        (state.scanCounts?.SCANNING ?? 0) + (state.scanCounts?.PASSED ?? 0) +
+        (state.scanCounts?.QUARANTINED ?? 0) + (state.scanCounts?.AUTO_REJECTED ?? 0) +
+        (state.scanCounts?.ERROR ?? 0);
+
+    // Check if there are any threat scanners available to filter by
+    const hasThreatScanners = state.availableThreatScanners.length > 0;
+
+    return useMemo(() => ({
+        tabIndex: 1,
+        tabName: 'Quarantined',
+        scans: quarantinedScans,
+        isLoading: state.isLoadingScans,
+        lastRefreshed: state.lastRefreshed,
+        autoRefresh: state.autoRefresh,
+        onAutoRefreshChange: actions.setAutoRefresh,
+        totalCount,
+        hasThreatScanners,
+        search,
+        globalFilters,
+        quarantineFilters,
+        pagination,
+        selection,
+        toggleCheck,
+        selectAll,
+        deselectAll,
+        isAllSelected,
+        isSomeSelected,
+        bulkActions,
+    }), [
+        quarantinedScans,
+        state.isLoadingScans,
+        state.lastRefreshed,
+        state.autoRefresh,
+        actions.setAutoRefresh,
+        totalCount,
+        hasThreatScanners,
+        search,
+        globalFilters,
+        quarantineFilters,
+        pagination,
+        selection,
+        toggleCheck,
+        selectAll,
+        deselectAll,
+        isAllSelected,
+        isSomeSelected,
+        bulkActions,
+    ]);
+};
+
+export type UseQuarantinedTabReturn = ReturnType<typeof useQuarantinedTab>;

package/src/hooks/scan-admin/use-scan-card-state.ts

@@ -0,0 +1,73 @@
+/********************************************************************************
+ * Copyright (c) 2026 Contributors to the Eclipse Foundation
+ *
+ * See the NOTICE file(s) distributed with this work for additional
+ * information regarding copyright ownership.
+ *
+ * This program and the accompanying materials are made available under the
+ * terms of the Eclipse Public License 2.0 which is available at
+ * https://www.eclipse.org/legal/epl-2.0
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ ********************************************************************************/
+
+import { useState, useEffect, useRef, useMemo } from 'react';
+import { ScanResult } from '../../context/scan-admin';
+import { formatDuration } from '../../components/scan-admin/common';
+import {
+    isRunning,
+    shouldShowExpandButton,
+    getDetailBadges,
+    DetailBadge,
+} from '../../components/scan-admin/scan-card/utils';
+
+interface UseScanCardStateReturn {
+    expanded: boolean;
+    handleExpandClick: () => void;
+    showExpandButton: boolean;
+    badges: DetailBadge[];
+    liveDuration: string;
+    // Card ref for height tracking
+    cardRef: React.RefObject<HTMLDivElement>;
+}
+
+/**
+ * Custom hook that encapsulates all ScanCard state logic.
+ */
+export const useScanCardState = (scan: ScanResult): UseScanCardStateReturn => {
+    const [expanded, setExpanded] = useState(false);
+    const [liveDuration, setLiveDuration] = useState('');
+
+    const cardRef = useRef<HTMLDivElement>(null);
+
+    const badges = useMemo(() => getDetailBadges(scan), [scan]);
+
+    const showExpandButton = shouldShowExpandButton(scan);
+
+    const handleExpandClick = () => {
+        setExpanded(!expanded);
+    };
+
+    // Live duration for running scans
+    useEffect(() => {
+        if (isRunning(scan.status) && scan.dateScanStarted) {
+            const updateDuration = () => {
+                const duration = formatDuration(scan.dateScanStarted, new Date().toISOString());
+                setLiveDuration(duration);
+            };
+            updateDuration();
+            const interval = setInterval(updateDuration, 1000);
+            return () => clearInterval(interval);
+        }
+        return undefined;
+    }, [scan.status, scan.dateScanStarted]);
+
+    return {
+        expanded,
+        handleExpandClick,
+        showExpandButton,
+        badges,
+        liveDuration,
+        cardRef,
+    };
+};