Merge branch 'main' into papertrial-logging

client/src/App.js

@@ -12,6 +12,7 @@ import MainContent from "./components/MainContent";
 import Login from "./pages/Login";
 import Onboard from "./pages/Onboard";
 import "./App.css";
+import AdminLogin from "./pages/AdminLogin";
 
 const AppRoutes = () => {
   const navigate = useNavigate();
@@ -35,6 +36,7 @@ const AppRoutes = () => {
   return (
     <Routes>
       <Route path="/" element={<Login />} />
+      <Route path="/admin-login" element={<AdminLogin />} />
       <Route path="/onboard" element={<Onboard />} />
       <Route
         path="/app/*"
@@ -58,12 +60,12 @@ function App() {
         fontWeight: "700",
         lineHeight: "1.2",
       },
-      "body1": {
+      body1: {
         fontSize: "16px",
         lineHeight: "1.78",
         fontWeight: "400",
       },
-      "body2": {
+      body2: {
         fontSize: "18px",
         lineHeight: "1.78",
         fontWeight: "400",
@@ -76,19 +78,19 @@ function App() {
       h1: {
         fontWeight: "700",
         fontSize: "54px",
-        lineHeight: "0.93"
+        lineHeight: "0.93",
       },
       h2: {
         fontWeight: "500",
         fontSize: "40px",
-        lineHeight: "1.78"
+        lineHeight: "1.78",
       },
       h3: {
         fontWeight: "500",
         fontSize: "32px",
-        lineHeight: "1.78"
-      }
-    }
+        lineHeight: "1.78",
+      },
+    },
   });
 
   return (

client/src/components/Api/Api.js

@@ -65,7 +65,6 @@ api.interceptors.response.use(
   },
   async (error) => {
     if (error.response) {
-
       if (error.response.data.message.toLowerCase().includes("session")) {
         window.location.href = "/";
         return Promise.reject(error.response.data);
@@ -140,13 +139,9 @@ export const getRefreshToken = async () => {
  * @returns {Promise<ApiResponse>}
  */
 export const fetchProspectingActivities = async (period, filterIds = []) => {
-  const params = new URLSearchParams();
-  params.append("period", period);
-  if (filterIds) {
-    filterIds.forEach((id) => params.append("filter_ids[]", id));
-  }
-  const response = await api.get("/get_prospecting_activities_by_ids", {
-    params,
+  const response = await api.post("/get_prospecting_activities_by_ids", {
+    period,
+    filterIds,
   });
   return { ...response.data, statusCode: response.status };
 };
@@ -159,13 +154,18 @@ export const fetchProspectingActivities = async (period, filterIds = []) => {
  * @param {string} searchTerm - Search term
  * @returns {Promise<ApiResponse>}
  */
-export const getPaginatedProspectingActivities = async (filterIds = [], page = 0, rowsPerPage = 10, searchTerm = "") => {
-  const params = new URLSearchParams();
-  filterIds.forEach(id => params.append('filter_ids[]', id));
-  params.append('page', page.toString());
-  params.append('rows_per_page', rowsPerPage.toString());
-  if (searchTerm) params.append('search', searchTerm);
-  const response = await api.get("/get_paginated_prospecting_activities", { params });
+export const getPaginatedProspectingActivities = async (
+  filterIds = [],
+  page = 0,
+  rowsPerPage = 10,
+  searchTerm = ""
+) => {
+  const response = await api.post("/get_paginated_prospecting_activities", {
+    filterIds,
+    page,
+    rowsPerPage,
+    searchTerm,
+  });
   return { ...response.data, statusCode: response.status };
 };
 
@@ -418,4 +418,19 @@ export const pauseStripePaymentSchedule = async (userId, email) => {
     email,
   });
   return { ...response.data, statusCode: response.status };
-};
+};
+
+/**
+ * Performs an admin login with the given user ID
+ * @param {string} userId - The ID of the user to login as
+ * @returns {Promise<ApiResponse>}
+ */
+export const adminLogin = async (userId) => {
+  try {
+    const response = await api.post("/admin_login", { userId });
+    return { ...response.data, statusCode: response.status };
+  } catch (error) {
+    console.error("Error during admin login:", error);
+    throw error;
+  }
+};

client/src/components/CustomTable/CustomTable.js

@@ -26,6 +26,7 @@ import ClearIcon from "@mui/icons-material/Clear";
 import TableHeader from "./TableHeader";
 import TableBody from "./TableBody";
 import { sortData } from "../../utils/data";
+import { debounce } from "lodash"; // Add this import at the top of the file
 
 /**
  * @typedef {import('types').TableColumn} TableColumn
@@ -65,22 +66,27 @@ const CustomTable = ({
   const [searchTerm, setSearchTerm] = useState("");
   const [localFilteredData, setLocalFilteredData] = useState(tableData.data);
   const [page, setPage] = useState(paginationConfig?.page || 0);
-  const [rowsPerPage, setRowsPerPage] = useState(paginationConfig?.rowsPerPage || 10);
+  const [rowsPerPage, setRowsPerPage] = useState(
+    paginationConfig?.rowsPerPage || 10
+  );
   const [orderBy, setOrderBy] = useState("");
   const [order, setOrder] = useState("asc");
   const [contextMenu, setContextMenu] = useState(null);
   const [modalOpen, setModalOpen] = useState(false);
   const [selectedRowId, setSelectedRowId] = useState(null);
 
   const isPaginated = !!paginationConfig;
-  const isServerSidePaginated = isPaginated && paginationConfig.type === "server-side";
+  const isServerSidePaginated =
+    isPaginated && paginationConfig.type === "server-side";
 
   const filteredData = useMemo(() => {
     return isServerSidePaginated ? tableData.data : localFilteredData;
   }, [tableData.data, localFilteredData, isServerSidePaginated]);
 
   const sortedData = useMemo(() => {
-    return isServerSidePaginated ? filteredData : sortData(filteredData, orderBy, order);
+    return isServerSidePaginated
+      ? filteredData
+      : sortData(filteredData, orderBy, order);
   }, [filteredData, orderBy, order, isServerSidePaginated]);
 
   const paginatedData = useMemo(() => {
@@ -224,7 +230,10 @@ const CustomTable = ({
           {isLoading ? (
             <tbody>
               <tr>
-                <td colSpan={tableData.columns.length} style={{ textAlign: 'center', padding: '20px' }}>
+                <td
+                  colSpan={tableData.columns.length}
+                  style={{ textAlign: "center", padding: "20px" }}
+                >
                   <CircularProgress />
                 </td>
               </tr>
@@ -241,25 +250,43 @@ const CustomTable = ({
         </Table>
       </TableContainer>
     ),
-    [paginatedData, tableData.columns, tableData.selectedIds, orderBy, order, selectedRowId, isLoading]
+    [
+      paginatedData,
+      tableData.columns,
+      tableData.selectedIds,
+      orderBy,
+      order,
+      selectedRowId,
+      isLoading,
+    ]
+  );
+
+  // Create a debounced version of the search function
+  const debouncedSearch = useMemo(
+    () =>
+      debounce((value) => {
+        if (paginationConfig?.type === "server-side") {
+          if (value.length > 3 || value.length === 0) {
+            onSearch(value);
+          }
+        } else {
+          // Perform local wildcard search on all columns
+          const filtered = tableData.data.filter((item) =>
+            Object.values(item).some((field) =>
+              String(field).toLowerCase().includes(value.toLowerCase())
+            )
+          );
+          setLocalFilteredData(filtered);
+          setPage(0); // Reset to first page when filtering
+        }
+      }, 2000),
+    [paginationConfig, onSearch, tableData.data]
   );
 
+  // Update the handleSearch function
   const handleSearch = (value) => {
     setSearchTerm(value);
-    if (paginationConfig?.type === "server-side") {
-      if (value.length > 3 || value.length === 0) {
-        onSearch(value);
-      }
-    } else {
-      // Perform local wildcard search on all columns
-      const filtered = tableData.data.filter(item =>
-        Object.values(item).some(field =>
-          String(field).toLowerCase().includes(value.toLowerCase())
-        )
-      );
-      setLocalFilteredData(filtered);
-      setPage(0); // Reset to first page when filtering
-    }
+    debouncedSearch(value);
   };
 
   return (
@@ -289,9 +316,13 @@ const CustomTable = ({
       {tableContent}
       {isPaginated && (
         <TablePagination
-          rowsPerPageOptions={[5, 10]}
+          rowsPerPageOptions={[5, 10, 25, 50]}
           component="div"
-          count={isServerSidePaginated ? (paginationConfig.totalItems || 0) : filteredData.length}
+          count={
+            isServerSidePaginated
+              ? paginationConfig.totalItems || 0
+              : filteredData.length
+          }
           rowsPerPage={rowsPerPage}
           page={page}
           onPageChange={handleChangePage}
@@ -376,4 +407,4 @@ const CustomTable = ({
   );
 };
 
-export default CustomTable;
+export default CustomTable;

client/src/components/FilterContainer/FilterContainer.js

@@ -353,7 +353,18 @@ const FilterContainer = ({
             logicErrors[0] ||
             "Use AND, OR, and numbers to create logic (e.g., 1 AND 2 OR 3)"
           }
-          onChange={(e) => handleLogicChange(e.target.value, onLogicChange)}
+          onChange={(e) => {
+            const value = e.target.value;
+
+            handleLogicChange(value, onLogicChange);
+          }}
+          onBlur={(e) => {
+            let value = e.target.value;
+            value = value.replace(/^\(\((.*)\)\)$/, "$1");
+            const formattedValue = `((${value}))`;
+
+            handleLogicChange(formattedValue, onLogicChange);
+          }}
         />
       </Box>
     </Box>

client/src/components/FilterContainer/useFilterLogic.js

@@ -122,16 +122,29 @@ export const useFilterLogic = (initialFilterContainer, initialFilterFields) => {
   );
 
   const handleAddFilter = useCallback(() => {
-    setFilterContainer((prevContainer) => ({
-      ...(prevContainer
-        ? prevContainer
-        : { filters: [], filterLogic: "", name: "", direction: "" }),
-      filters: [
-        ...prevContainer.filters,
-        { field: "", operator: "", value: "", dataType: "string" },
-      ],
-      filterLogic: prevContainer.filters.length === 0 ? "1" : `${prevContainer.filterLogic} AND ${prevContainer.filters.length + 1}`
-    }));
+    setFilterContainer((prevContainer) => {
+      const isInitialFilter = prevContainer.filters.length === 0;
+      const newFilterIndex = prevContainer.filters.length + 1;
+
+      const baseLogic = isInitialFilter
+        ? "1"
+        : `${prevContainer.filterLogic} AND ${newFilterIndex}`;
+
+      const formattedLogic = prevContainer.filterLogic.startsWith("((") && prevContainer.filterLogic.endsWith("))")
+        ? baseLogic
+        : `((${baseLogic}))`;
+
+      return {
+        ...(prevContainer
+          ? prevContainer
+          : { filters: [], filterLogic: "", name: "", direction: "" }),
+        filters: [
+          ...prevContainer.filters,
+          { field: "", operator: "", value: "", dataType: "string" },
+        ],
+        filterLogic: formattedLogic
+      }
+    });
   }, []);
 
   const handleDeleteFilter = useCallback(

client/src/index.js

@@ -2,7 +2,6 @@ import React from "react";
 import ReactDOM from "react-dom/client";
 import "./index.css";
 import App from "./App";
-import reportWebVitals from "./reportWebVitals";
 
 import * as Sentry from "@sentry/react";
 
@@ -20,11 +19,17 @@ Sentry.init({
 const root = ReactDOM.createRoot(document.getElementById("root"));
 root.render(
   <React.StrictMode>
-    <App />
+    <Sentry.ErrorBoundary fallback={<ErrorFallback />}>
+      <App />
+    </Sentry.ErrorBoundary>
   </React.StrictMode>
 );
 
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
+function ErrorFallback({error}) {
+  return (
+    <div>
+      <h1>Oops! Something went wrong.</h1>
+      <pre>{error.message}</pre>
+    </div>
+  );
+}