[pull] main from KelvinTegelaar:main

.github/workflows/dev_deploy.yml

@@ -25,7 +25,7 @@ jobs:
           # For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
           app_location: '/' # App source code path
           api_location: '' # Api source code path - optional
-          output_location: 'out' # Built app content directory - optional
+          output_location: '/out' # Built app content directory - optional
           ###### End of Repository/Build Configurations ######
 
   close_pull_request_job:

.gitignore

@@ -26,4 +26,5 @@ yarn-debug.log*
 yarn-error.log*
 
 # vscode debug logs
-debug.log
+debug.log
+app.log

Tools/Start-CippDevEmulators.ps1

@@ -1,6 +1,7 @@
 Get-Command wt -ErrorAction Stop | Out-Null
 Get-Process node -ErrorAction SilentlyContinue | Stop-Process -ErrorAction SilentlyContinue
 $Path = (Get-Item $PSScriptRoot).Parent.Parent.FullName
+Write-Host "CIPP Dev Emulators starting in $Path" -ForegroundColor Green
 
 pwsh -file (Join-Path $PSScriptRoot 'Start-CippDevInstallation.ps1')
 
@@ -11,8 +12,7 @@ if (Test-Path (Join-Path $Path 'CIPP-API-Processor')) {
 }
 
 if ($Process -eq 'y') {
-    wt --title CIPP`; new-tab --title 'Azurite' -d $Path pwsh -c azurite`; new-tab --title 'FunctionApp' -d $Path\CIPP-API pwsh -c func start`; new-tab --title 'CIPP Frontend' -d $Path\CIPP pwsh -c npm run dev`; new-tab --title 'SWA' -d $Path\CIPP pwsh -c npm run start-swa`; new-tab --title 'CIPP-API-Processor' -d $Path\CIPP-API-Processor pwsh -c func start --port 7072
+  wt --title CIPP`; new-tab --title 'Azurite' -d $Path pwsh -c azurite`; new-tab --title 'FunctionApp' -d $Path\CIPP-API pwsh -c func start`; new-tab --title 'CIPP Frontend' -d $Path\CIPP pwsh -c npm run dev`; new-tab --title 'SWA' -d $Path\CIPP pwsh -c npm run start-swa`; new-tab --title 'CIPP-API-Processor' -d $Path\CIPP-API-Processor pwsh -c func start --port 7072
 } else {
-    wt --title CIPP`; new-tab --title 'Azurite' -d $Path pwsh -c azurite`; new-tab --title 'FunctionApp' -d $Path\CIPP-API pwsh -c func start`; new-tab --title 'CIPP Frontend' -d $Path\CIPP pwsh -c npm run dev`; new-tab --title 'SWA' -d $Path\CIPP pwsh -c npm run start-swa
+  wt --title CIPP`; new-tab --title 'Azurite' -d $Path pwsh -c azurite`; new-tab --title 'FunctionApp' -d $Path\CIPP-API pwsh -c func start`; new-tab --title 'CIPP Frontend' -d $Path\CIPP pwsh -c npm run dev`; new-tab --title 'SWA' -d $Path\CIPP pwsh -c npm run start-swa
 }
-

next.config.js

@@ -14,6 +14,8 @@ const config = {
   async redirects() {
     return [];
   },
+  output: "export",
+  distDir: "./out",
 };
 
 module.exports = config;

package.json

@@ -8,36 +8,36 @@
   },
   "license": "AGPL-3.0",
   "engines": {
-    "node": "^22.13.0"
+    "node": "^20.18.3"
   },
   "repository": {
     "type": "git",
     "url": "git@github.com:KelvinTegelaar/CIPP.git"
   },
   "scripts": {
     "dev": "next -H 127.0.0.1",
-    "build": "next build && next export",
+    "build": "next build && rm -rf package.json yarn.lock",
     "start": "next start",
     "export": "next export",
     "lint": "next lint",
     "lint-fix": "next lint --fix",
     "start-swa": "swa start --swa-config-location .vscode http://127.0.0.1:3000 --api-location http://127.0.0.1:7071 --verbose=silly"
   },
   "dependencies": {
-    "@emotion/cache": "11.10.5",
-    "@emotion/react": "11.13.3",
-    "@emotion/server": "11.10.0",
-    "@emotion/styled": "11.13.0",
-    "@heroicons/react": "2.0.15",
+    "@emotion/cache": "11.14.0",
+    "@emotion/react": "11.14.0",
+    "@emotion/server": "11.11.0",
+    "@emotion/styled": "11.14.0",
+    "@heroicons/react": "2.2.0",
     "@monaco-editor/react": "^4.6.0",
-    "@mui/icons-material": "6.1.6",
-    "@mui/lab": "6.0.0-beta.14",
-    "@mui/material": "6.1.6",
-    "@mui/system": "6.1.6",
-    "@mui/x-date-pickers": "7.22.1",
+    "@mui/icons-material": "6.4.7",
+    "@mui/lab": "6.0.0-beta.30",
+    "@mui/material": "6.4.7",
+    "@mui/system": "6.4.7",
+    "@mui/x-date-pickers": "7.27.3",
     "@musement/iso-duration": "^1.0.0",
-    "@react-pdf/renderer": "3.1.2",
-    "@reduxjs/toolkit": "1.9.2",
+    "@react-pdf/renderer": "4.3.0",
+    "@reduxjs/toolkit": "2.6.1",
     "@tanstack/react-query": "^5.51.11",
     "@tanstack/react-query-devtools": "^5.51.11",
     "@tanstack/react-table": "^8.19.2",
@@ -49,63 +49,63 @@
     "@tiptap/react": "^2.9.1",
     "@tiptap/starter-kit": "^2.9.1",
     "@uiw/react-json-view": "^2.0.0-alpha.30",
-    "apexcharts": "3.36.3",
+    "apexcharts": "4.5.0",
     "axios": "^1.7.2",
-    "date-fns": "2.29.3",
-    "eml-parse-js": "^1.1.15",
+    "date-fns": "4.1.0",
+    "eml-parse-js": "^1.2.0-beta.0",
     "export-to-csv": "^1.3.0",
-    "formik": "2.2.9",
+    "formik": "2.4.6",
     "gray-matter": "4.0.3",
-    "i18next": "22.4.9",
+    "i18next": "24.2.3",
     "javascript-time-ago": "^2.5.11",
-    "jspdf": "^2.5.1",
-    "jspdf-autotable": "^3.8.2",
+    "jspdf": "^3.0.0",
+    "jspdf-autotable": "^5.0.2",
     "leaflet": "^1.9.4",
     "leaflet-defaulticon-compatibility": "^0.1.2",
     "leaflet.markercluster": "^1.5.3",
     "lodash.isequal": "4.5.0",
     "material-react-table": "^3.0.1",
     "monaco-editor": "^0.52.0",
     "mui-tiptap": "^1.14.0",
-    "next": "^13.5.6",
+    "next": "^15.2.2",
     "nprogress": "0.2.0",
     "numeral": "2.0.6",
     "prop-types": "15.8.1",
-    "react": "18.2.0",
-    "react-apexcharts": "1.4.0",
+    "react": "19.0.0",
+    "react-apexcharts": "1.7.0",
     "react-beautiful-dnd": "13.1.1",
     "react-copy-to-clipboard": "^5.1.0",
-    "react-dom": "18.2.0",
-    "react-dropzone": "14.2.3",
-    "react-error-boundary": "^4.0.13",
+    "react-dom": "19.0.0",
+    "react-dropzone": "14.3.8",
+    "react-error-boundary": "^5.0.0",
     "react-grid-layout": "^1.5.0",
     "react-hook-form": "^7.53.0",
-    "react-hot-toast": "2.4.0",
+    "react-hot-toast": "2.5.2",
     "react-html-parser": "^2.0.2",
-    "react-i18next": "12.1.4",
-    "react-leaflet": "4.2.1",
-    "react-leaflet-markercluster": "^4.2.1",
-    "react-markdown": "8.0.5",
+    "react-i18next": "15.4.1",
+    "react-leaflet": "5.0.0",
+    "react-leaflet-markercluster": "^5.0.0-rc.0",
+    "react-markdown": "10.1.0",
     "react-media-hook": "^0.5.0",
     "react-papaparse": "^4.4.0",
-    "react-quill": "^0.0.2",
-    "react-redux": "8.0.5",
+    "react-quill": "^2.0.0",
+    "react-redux": "9.2.0",
     "react-syntax-highlighter": "^15.6.1",
     "react-time-ago": "^7.3.3",
     "react-window": "^1.8.10",
-    "redux": "4.2.1",
+    "redux": "5.0.1",
     "redux-devtools-extension": "2.13.9",
     "redux-persist": "^6.0.0",
-    "redux-thunk": "2.4.2",
-    "simplebar": "6.2.0",
-    "simplebar-react": "3.2.0",
+    "redux-thunk": "3.1.0",
+    "simplebar": "6.3.0",
+    "simplebar-react": "3.3.0",
     "stylis-plugin-rtl": "2.1.1",
-    "typescript": "4.9.4",
-    "yup": "0.32.11"
+    "typescript": "5.8.2",
+    "yup": "1.6.1"
   },
   "devDependencies": {
-    "@svgr/webpack": "6.5.1",
-    "eslint": "8.32.0",
-    "eslint-config-next": "13.1.6"
+    "@svgr/webpack": "8.1.0",
+    "eslint": "9.22.0",
+    "eslint-config-next": "15.2.2"
   }
 }

public/version.json

@@ -1,3 +1,3 @@
 {
-  "version": "7.3.2"
+  "version": "7.4.1"
 }

src/api/ApiCall.jsx

@@ -1,4 +1,4 @@
-import { useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { keepPreviousData, useInfiniteQuery, useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import axios, { isAxiosError } from "axios";
 import { useDispatch } from "react-redux";
 import { showToast } from "../store/toasts";
@@ -17,6 +17,9 @@ export function ApiGetCall(props) {
     onResult,
     staleTime = 600000, // 10 minutes
     refetchOnWindowFocus = false,
+    refetchOnMount = true,
+    refetchOnReconnect = true,
+    keepPreviousData = false,
   } = props;
   const queryClient = useQueryClient();
   const dispatch = useDispatch();
@@ -102,6 +105,9 @@ export function ApiGetCall(props) {
     },
     staleTime: staleTime,
     refetchOnWindowFocus: refetchOnWindowFocus,
+    refetchOnMount: refetchOnMount,
+    refetchOnReconnect: refetchOnReconnect,
+    keepPreviousData: keepPreviousData,
     retry: retryFn,
   });
   return queryInfo;

src/components/CippCards/CippExchangeInfoCard.jsx

@@ -1,13 +1,23 @@
 import PropTypes from "prop-types";
-import { Card, CardHeader, Divider, Skeleton, Chip } from "@mui/material";
+import {
+  Card,
+  CardHeader,
+  Divider,
+  Skeleton,
+  Chip,
+  IconButton,
+  Typography,
+  CircularProgress,
+} from "@mui/material";
 import { PropertyList } from "/src/components/property-list";
 import { PropertyListItem } from "/src/components/property-list-item";
 import { getCippFormatting } from "../../utils/get-cipp-formatting";
-import { Check as CheckIcon, Close as CloseIcon } from "@mui/icons-material";
+import { Check as CheckIcon, Close as CloseIcon, Sync } from "@mui/icons-material";
 import { LinearProgressWithLabel } from "../linearProgressWithLabel";
+import { Stack } from "@mui/system";
 
 export const CippExchangeInfoCard = (props) => {
-  const { exchangeData, isFetching = false, ...other } = props;
+  const { exchangeData, isLoading = false, isFetching = false, handleRefresh, ...other } = props;
 
   // Define the protocols array
   const protocols = [
@@ -21,14 +31,30 @@ export const CippExchangeInfoCard = (props) => {
 
   return (
     <Card {...other}>
-      <CardHeader title="Exchange Details" />
+      <CardHeader
+        title={
+          <Stack
+            direction="row"
+            sx={{ alignItems: "center", display: "flex", justifyContent: "space-between" }}
+          >
+            <Typography variant="h6">Exchange Information</Typography>
+            {isFetching ? (
+              <CircularProgress size={20} />
+            ) : (
+              <IconButton onClick={handleRefresh} size="small">
+                <Sync />
+              </IconButton>
+            )}
+          </Stack>
+        }
+      />
       <Divider />
       <PropertyList>
         <PropertyListItem
           divider
           label="Mailbox Type"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={120} />
             ) : (
               exchangeData?.RecipientTypeDetails || "N/A"
@@ -39,12 +65,15 @@ export const CippExchangeInfoCard = (props) => {
           divider
           label="Mailbox Usage"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={80} />
             ) : exchangeData?.TotalItemSize != null ? (
               <LinearProgressWithLabel
                 sx={{ width: "100%" }}
                 variant="determinate"
+                addedLabel={`(${Math.round(exchangeData.TotalItemSize)}/${Math.round(
+                  exchangeData?.ProhibitSendReceiveQuota
+                )}GB)`}
                 value={
                   Math.round(
                     (exchangeData?.TotalItemSize / exchangeData?.ProhibitSendReceiveQuota) *
@@ -62,7 +91,7 @@ export const CippExchangeInfoCard = (props) => {
           divider
           label="Hidden From Address Lists"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={60} />
             ) : (
               getCippFormatting(exchangeData?.HiddenFromAddressLists, "HiddenFromAddressLists")
@@ -72,7 +101,7 @@ export const CippExchangeInfoCard = (props) => {
         <PropertyListItem
           label="Forward and Deliver"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={60} />
             ) : (
               getCippFormatting(exchangeData?.ForwardAndDeliver, "ForwardAndDeliver")
@@ -83,7 +112,7 @@ export const CippExchangeInfoCard = (props) => {
           divider
           label="Forwarding Address"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={180} />
             ) : (
               exchangeData?.ForwardingAddress || "N/A"
@@ -93,7 +122,7 @@ export const CippExchangeInfoCard = (props) => {
         <PropertyListItem
           label="Archive Mailbox Enabled"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={60} />
             ) : (
               getCippFormatting(exchangeData?.ArchiveMailBox, "ArchiveMailBox")
@@ -103,7 +132,7 @@ export const CippExchangeInfoCard = (props) => {
         <PropertyListItem
           label="Auto Expanding Archive"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={80} />
             ) : (
               getCippFormatting(exchangeData?.AutoExpandingArchive, "AutoExpandingArchive")
@@ -113,7 +142,7 @@ export const CippExchangeInfoCard = (props) => {
         <PropertyListItem
           label="Total Archive Item Size"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={80} />
             ) : exchangeData?.TotalArchiveItemSize != null ? (
               `${exchangeData.TotalArchiveItemSize} GB`
@@ -126,7 +155,7 @@ export const CippExchangeInfoCard = (props) => {
           divider
           label="Total Archive Item Count"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={80} />
             ) : exchangeData?.TotalArchiveItemCount != null ? (
               exchangeData.TotalArchiveItemCount
@@ -139,7 +168,7 @@ export const CippExchangeInfoCard = (props) => {
           divider
           label="Litigation Hold"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={60} />
             ) : (
               getCippFormatting(exchangeData?.LitigationHold, "LitigationHold")
@@ -151,7 +180,7 @@ export const CippExchangeInfoCard = (props) => {
           divider
           label="Mailbox Protocols"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={200} />
             ) : (
               <div>
@@ -174,7 +203,7 @@ export const CippExchangeInfoCard = (props) => {
           divider
           label="Blocked For Spam"
           value={
-            isFetching ? (
+            isLoading ? (
               <Skeleton variant="text" width={60} />
             ) : (
               getCippFormatting(exchangeData?.BlockedForSpam, "BlockedForSpam")
@@ -188,5 +217,7 @@ export const CippExchangeInfoCard = (props) => {
 
 CippExchangeInfoCard.propTypes = {
   exchangeData: PropTypes.object,
+  isLoading: PropTypes.bool,
   isFetching: PropTypes.bool,
+  handleRefresh: PropTypes.func,
 };