Merge pull request #81 from KelvinTegelaar/dev

[pull] dev from KelvinTegelaar:dev
bmsimp · Feb 9, 2025 · 356fd63 · 356fd63
2 parents 59bc266 + 1af3428
commit 356fd63
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 15 deletions.
diff --git a/src/components/CippComponents/CippAutocomplete.jsx b/src/components/CippComponents/CippAutocomplete.jsx
@@ -14,13 +14,19 @@ import { Sync } from "@mui/icons-material";
 import { Stack } from "@mui/system";
 import React from "react";
 
-const MemoTextField = React.memo(function MemoTextField({ params, label, ...otherProps }) {
+const MemoTextField = React.memo(function MemoTextField({
+  params,
+  label,
+  placeholder,
+  ...otherProps
+}) {
   const { InputProps, ...otherParams } = params;
 
   return (
     <TextField
       {...otherParams}
       label={label}
+      placeholder={placeholder}
       variant="outlined"
       {...otherProps}
       slotProps={{
@@ -187,6 +193,7 @@ export const CippAutoComplete = (props) => {
       disableClearable={disableClearable}
       multiple={multiple}
       fullWidth
+      placeholder={placeholder}
       filterOptions={(options, params) => {
         const filtered = filter(options, params);
         const isExisting =
@@ -261,7 +268,7 @@ export const CippAutoComplete = (props) => {
       sx={sx}
       renderInput={(params) => (
         <Stack direction="row" spacing={1}>
-          <MemoTextField params={params} label={label} {...other} />
+          <MemoTextField params={params} label={label} placeholder={placeholder} {...other} />
           {api?.url && api?.showRefresh && (
             <IconButton
               size="small"

diff --git a/src/components/CippIntegrations/CippApiClientManagement.jsx b/src/components/CippIntegrations/CippApiClientManagement.jsx
@@ -77,12 +77,14 @@ const CippApiClientManagement = () => {
           name: "Role",
           multiple: false,
           creatable: false,
-          placeholder: "Select Role",
+          label: "Select Role",
+          placeholder: "Choose a role from the Custom Role list.",
           api: {
             url: "/api/ListCustomRole",
             queryKey: "CustomRoleList",
             labelField: "RowKey",
             valueField: "RowKey",
+            showRefresh: true,
           },
         },
         {
@@ -92,7 +94,8 @@ const CippApiClientManagement = () => {
           freeSolo: true,
           creatable: true,
           options: [],
-          placeholder: "Enter IP Range (Single hosts or CIDR notation)",
+          label: "Enter IP Range (Single hosts or CIDR notation)",
+          placeholder: "Type in the IP addresses and hit enter.",
         },
         {
           type: "switch",
@@ -231,7 +234,7 @@ const CippApiClientManagement = () => {
               value: azureConfig.data?.Results?.TenantID ? (
                 <CippCopyToClipBoard
                   type="chip"
-                  text={`https://logon.microsoftonline.com/${azureConfig.data?.Results?.TenantID}/oauth2/v2.0/token`}
+                  text={`https://login.microsoftonline.com/${azureConfig.data?.Results?.TenantID}/oauth2/v2.0/token`}
                 />
               ) : (
                 "Not Available"
@@ -301,20 +304,23 @@ const CippApiClientManagement = () => {
           {
             type: "textField",
             name: "AppName",
-            placeholder: "Enter App Name",
+            label: "App Name",
+            placeholder: "Enter a name for this Application Registration.",
           },
           {
             type: "autoComplete",
             name: "Role",
             multiple: false,
             creatable: false,
-            placeholder: "Select Role",
+            label: "Select Role",
             api: {
               url: "/api/ListCustomRole",
               queryKey: "CustomRoleList",
               labelField: "RowKey",
               valueField: "RowKey",
+              showRefresh: true,
             },
+            placeholder: "Choose a role from the Custom Role list.",
           },
           {
             type: "autoComplete",
@@ -323,7 +329,8 @@ const CippApiClientManagement = () => {
             freeSolo: true,
             creatable: true,
             options: [],
-            placeholder: "Enter IP Range (Single hosts or CIDR notation)",
+            label: "Enter IP Ranges (Single hosts or CIDR notation)",
+            placeholder: "Type in the IP addresses and hit enter.",
           },
           {
             type: "switch",
@@ -348,7 +355,8 @@ const CippApiClientManagement = () => {
           {
             type: "autoComplete",
             name: "ClientId",
-            placeholder: "Select Existing App",
+            label: "Existing App",
+            placeholder: "Select an existing API application.",
             api: {
               type: "GET",
               url: "/api/ExecApiClient",
@@ -361,6 +369,7 @@ const CippApiClientManagement = () => {
                 displayName: "displayName",
                 createdDateTime: "createdDateTime",
               },
+              showRefresh: true,
             },
             creatable: false,
             multiple: false,
@@ -370,12 +379,14 @@ const CippApiClientManagement = () => {
             name: "Role",
             multiple: false,
             creatable: false,
-            placeholder: "Select Role",
+            label: "Select Role",
+            placeholder: "Choose a role from the Custom Role list.",
             api: {
               url: "/api/ListCustomRole",
               queryKey: "CustomRoleList",
               labelField: "RowKey",
               valueField: "RowKey",
+              showRefresh: true,
             },
           },
           {
@@ -385,7 +396,8 @@ const CippApiClientManagement = () => {
             freeSolo: true,
             creatable: true,
             options: [],
-            placeholder: "Enter IP Range(s)",
+            label: "Enter IP Ranges (Single hosts or CIDR notation)",
+            placeholder: "Type in the IP addresses and hit enter.",
           },
           {
             type: "switch",

diff --git a/src/components/CippSettings/CippCustomRoles.jsx b/src/components/CippSettings/CippCustomRoles.jsx
@@ -286,8 +286,9 @@ export const CippCustomRoles = () => {
             />
             {cippApiRoleSelected && (
               <Alert color="info">
-                This role will limit access for the CIPP-API integration. It is not intended to be
-                used for users.
+                This is the default role for all API clients in the CIPP-API integration. If you
+                would like different permissions for specific applications, create a role per
+                application and select it from the CIPP-API integrations page.
               </Alert>
             )}
           </Stack>

diff --git a/src/components/CippTable/CIPPTableToptoolbar.js b/src/components/CippTable/CIPPTableToptoolbar.js
@@ -1,4 +1,4 @@
-import { DeveloperMode, Sync, Tune, ViewColumn } from "@mui/icons-material";
+import { DeveloperMode, SevereCold, Sync, Tune, ViewColumn } from "@mui/icons-material";
 import {
   Button,
   Checkbox,
@@ -442,6 +442,11 @@ export const CIPPTableToptoolbar = ({
         </Box>
         <Box>
           <Box sx={{ display: "flex", gap: "0.5rem" }}>
+            {getRequestData?.data?.pages?.[0].Metadata?.ColdStart === true && (
+              <Tooltip title="Function App cold start was detected, data takes a little longer to retrieve on first load.">
+                <SevereCold />
+              </Tooltip>
+            )}
             {actions && (table.getIsSomeRowsSelected() || table.getIsAllRowsSelected()) && (
               <>
                 <Button

diff --git a/src/pages/cipp/integrations/configure.js b/src/pages/cipp/integrations/configure.js
@@ -1,4 +1,14 @@
-import { Alert, Box, Button, CardContent, Stack, Tab, Tabs, Typography } from "@mui/material";
+import {
+  Alert,
+  Box,
+  Button,
+  CardContent,
+  Skeleton,
+  Stack,
+  Tab,
+  Tabs,
+  Typography,
+} from "@mui/material";
 import CippIntegrationSettings from "/src/components/CippIntegrations/CippIntegrationSettings";
 import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import { useForm } from "react-hook-form";
@@ -96,6 +106,17 @@ const Page = () => {
 
   return (
     <>
+      {integrations.isLoading && (
+        <CippPageCard title="Integrations" headerText={extension.headerText} hideTitleText={true}>
+          <CardContent>
+            <Stack spacing={2}>
+              <Skeleton variant="rectangular" height={150} />
+              <Skeleton variant="rectangular" height={150} />
+              <Skeleton variant="rectangular" height={400} />
+            </Stack>
+          </CardContent>
+        </CippPageCard>
+      )}
       {integrations.isSuccess && extension && (
         <CippPageCard
           title={extension.name}