@snapdragonsnursery/react-components 1.19.0 → 1.19.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@snapdragonsnursery/react-components",
-  "version": "1.19.0",
+  "version": "1.19.2",
   "description": "",
   "main": "src/index.js",
   "scripts": {

package/src/EmployeeSearchModal.jsx

@@ -1,6 +1,6 @@
 // Employee Search Modal Component
 // Provides a modal interface for employee search with advanced filtering and selection capabilities
-// Usage: <EmployeeSearchModal isOpen={isOpen} onClose={onClose} onSelect={handleSelect} />
+// Usage: <EmployeeSearchModal isOpen={isOpen} onClose={onClose} onSelect={handleSelect} showFiltersPanel={false} />
 
 import React, { useState, useEffect, useCallback } from "react";
 import { useMsal } from "@azure/msal-react";
@@ -47,7 +47,7 @@ const EmployeeSearchModal = ({
   onClose,
   onSelect,
   title = "Select Employee",
-  searchPlaceholder = "Search by name, ID, or email address...",
+  searchPlaceholder = "Search by name, Employee ID, or email address...",
   siteId = null,
   siteIds = null,
   sites = null,
@@ -90,6 +90,8 @@ const EmployeeSearchModal = ({
   visibleColumns = null,
   columnLabels = {},
   columnRenderers = {},
+  showFiltersPanel = true,
+  dataProfile = "full",
 }) => {
   const [searchTerm, setSearchTerm] = useState("");
   const [employees, setEmployees] = useState([]);
@@ -219,7 +221,9 @@ const EmployeeSearchModal = ({
           }
         }
 
-        console.warn(`Failed to fetch profile picture for ${entraId}: Non-200 response`);
+        console.warn(
+          `Failed to fetch profile picture for ${entraId}: Non-200 response`
+        );
       } catch (error) {
         console.warn(`Error fetching profile picture for ${entraId}:`, error);
       } finally {
@@ -315,7 +319,7 @@ const EmployeeSearchModal = ({
   });
 
   // Define default data columns (excluding optional select)
-  const defaultDataColumns = [
+  const basicColumns = [
     columnHelper.accessor("full_name", {
       header: createSortableHeader(
         "full_name",
@@ -327,9 +331,11 @@ const EmployeeSearchModal = ({
         ) : (
           <div>
             <div className="font-medium">{row.original.full_name}</div>
-            <div className="text-sm text-gray-500">
-              ID: {row.original.employee_id}
-            </div>
+            {dataProfile !== "basic" && row.original.employee_id ? (
+              <div className="text-sm text-gray-500">
+                ID: {row.original.employee_id}
+              </div>
+            ) : null}
           </div>
         ),
     }),
@@ -366,6 +372,9 @@ const EmployeeSearchModal = ({
           <span className="text-sm">{row.original.email}</span>
         ),
     }),
+  ];
+
+  const extendedColumns = [
     columnHelper.accessor("start_date", {
       header: createSortableHeader(
         "start_date",
@@ -429,6 +438,11 @@ const EmployeeSearchModal = ({
     }),
   ];
 
+  const defaultDataColumns =
+    dataProfile === "basic"
+      ? basicColumns
+      : [...basicColumns, ...extendedColumns];
+
   const selectColumn = columnHelper.display({
     id: "select",
     header: ({ table }) => (
@@ -608,6 +622,10 @@ const EmployeeSearchModal = ({
         bypass_permissions: bypassPermissions.toString(),
       });
 
+      if (dataProfile && dataProfile !== "full") {
+        params.append("data_profile", dataProfile);
+      }
+
       // Handle site filtering
       if (siteIds && siteIds.length > 0) {
         params.append("site_ids", siteIds.join(","));
@@ -745,6 +763,7 @@ const EmployeeSearchModal = ({
     debouncedAdvancedFilters,
     applicationContext,
     bypassPermissions,
+    dataProfile,
   ]);
 
   // Search when debounced term changes
@@ -885,28 +904,30 @@ const EmployeeSearchModal = ({
             </div>
 
             {/* Advanced Filters */}
-            <EmployeeSearchFilters
-              filters={advancedFilters}
-              onFiltersChange={setAdvancedFilters}
-              onApplyFilters={setAdvancedFilters}
-              sites={sites}
-              roles={roles}
-              managers={managers}
-              activeOnly={activeOnly}
-              isAdvancedFiltersOpen={isAdvancedFiltersOpen}
-              onToggleAdvancedFilters={() =>
-                setIsAdvancedFiltersOpen(!isAdvancedFiltersOpen)
-              }
-              onClearFilters={clearFilters}
-              showRoleFilter={showRoleFilter}
-              showManagerFilter={showManagerFilter}
-              showTermTimeFilter={showTermTimeFilter}
-              showMaternityFilter={showMaternityFilter}
-              showStartDateFilter={showStartDateFilter}
-              showEndDateFilter={showEndDateFilter}
-              showDbsFilter={showDbsFilter}
-              showWorkingHoursFilter={showWorkingHoursFilter}
-            />
+            {showFiltersPanel && (
+              <EmployeeSearchFilters
+                filters={advancedFilters}
+                onFiltersChange={setAdvancedFilters}
+                onApplyFilters={setAdvancedFilters}
+                sites={sites}
+                roles={roles}
+                managers={managers}
+                activeOnly={activeOnly}
+                isAdvancedFiltersOpen={isAdvancedFiltersOpen}
+                onToggleAdvancedFilters={() =>
+                  setIsAdvancedFiltersOpen(!isAdvancedFiltersOpen)
+                }
+                onClearFilters={clearFilters}
+                showRoleFilter={showRoleFilter}
+                showManagerFilter={showManagerFilter}
+                showTermTimeFilter={showTermTimeFilter}
+                showMaternityFilter={showMaternityFilter}
+                showStartDateFilter={showStartDateFilter}
+                showEndDateFilter={showEndDateFilter}
+                showDbsFilter={showDbsFilter}
+                showWorkingHoursFilter={showWorkingHoursFilter}
+              />
+            )}
 
             {/* Results */}
             <div className="bg-white dark:bg-gray-800 rounded-lg border border-gray-200 dark:border-gray-700">