Add back sync autopilot devices button

Add icons

More icons

Add SharePoint Admin portal and update icons in bulk actions menu

update icon property

there must be a less ugly way to do this, help

Add icons to action buttons across various pages

Author: kris6673

src/components/bulk-actions-menu.js

@@ -2,6 +2,33 @@ import PropTypes from "prop-types";
 import ChevronDownIcon from "@heroicons/react/24/outline/ChevronDownIcon";
 import { Button, Link, ListItemText, Menu, MenuItem, SvgIcon } from "@mui/material";
 import { usePopover } from "../hooks/use-popover";
+import { FilePresent, Laptop, Mail, Share, Shield, ShieldMoon } from "@mui/icons-material";
+import { GlobeAltIcon, UsersIcon, ServerIcon } from "@heroicons/react/24/outline";
+
+function getIconByName(iconName) {
+  switch (iconName) {
+    case "GlobeAltIcon":
+      return <GlobeAltIcon />;
+    case "Mail":
+      return <Mail />;
+    case "UsersIcon":
+      return <UsersIcon />;
+    case "FilePresent":
+      return <FilePresent />;
+    case "ServerIcon":
+      return <ServerIcon />;
+    case "Laptop":
+      return <Laptop />;
+    case "Share":
+      return <Share />;
+    case "Shield":
+      return <Shield />;
+    case "ShieldMoon":
+      return <ShieldMoon />;
+    default:
+      return null;
+  }
+}
 
 export const BulkActionsMenu = (props) => {
   const { buttonName, sx, row, actions = [], ...other } = props;
@@ -55,12 +82,14 @@ export const BulkActionsMenu = (props) => {
                 target="_blank"
                 rel="noreferrer"
               >
+                <SvgIcon sx={{ mr: 1 }}>{getIconByName(action.icon)}</SvgIcon>
                 <ListItemText primary={action.label} />
               </MenuItem>
             );
           } else {
             return (
               <MenuItem key={index} onClick={action.onClick}>
+                <SvgIcon sx={{ mr: 1 }}>{getIconByName(action.icon)}</SvgIcon>
                 <ListItemText primary={action.label} />
               </MenuItem>
             );

src/data/portals.json

@@ -6,7 +6,7 @@
     "variable": "customerId",
     "target": "_blank",
     "external": true,
-    "icon": "cog"
+    "icon": "GlobeAltIcon"
   },
   {
     "label": "Exchange Portal",
@@ -15,7 +15,7 @@
     "variable": "defaultDomainName",
     "target": "_blank",
     "external": true,
-    "icon": "mail-bulk"
+    "icon": "Mail"
   },
   {
     "label": "Entra Portal",
@@ -24,7 +24,7 @@
     "variable": "defaultDomainName",
     "target": "_blank",
     "external": true,
-    "icon": "users"
+    "icon": "UsersIcon"
   },
   {
     "label": "Teams Portal",
@@ -33,7 +33,7 @@
     "variable": "defaultDomainName",
     "target": "_blank",
     "external": true,
-    "icon": "comments"
+    "icon": "FilePresent"
   },
   {
     "label": "Azure Portal",
@@ -42,7 +42,7 @@
     "variable": "defaultDomainName",
     "target": "_blank",
     "external": true,
-    "icon": "server"
+    "icon": "ServerIcon"
   },
   {
     "label": "Intune Portal",
@@ -51,7 +51,16 @@
     "variable": "defaultDomainName",
     "target": "_blank",
     "external": true,
-    "icon": "laptop-code"
+    "icon": "Laptop"
+  },
+  {
+    "label": "SharePoint Admin",
+    "name": "SharePoint_Admin",
+    "url": "https://admin.microsoft.com/Partner/beginclientsession.aspx?CTID=customerId&CSDEST=SharePoint",
+    "variable": "customerId",
+    "target": "_blank",
+    "external": true,
+    "icon": "Share"
   },
   {
     "label": "Security Portal",
@@ -60,7 +69,7 @@
     "variable": "customerId",
     "target": "_blank",
     "external": true,
-    "icon": "shield-alt"
+    "icon": "Shield"
   },
   {
     "label": "Compliance Portal",
@@ -69,15 +78,6 @@
     "variable": "customerId",
     "target": "_blank",
     "external": true,
-    "icon": "shield-alt"
-  },
-  {
-    "label": "SharePoint Admin",
-    "name": "SharePoint_Admin",
-    "url": "https://admin.microsoft.com/Partner/beginclientsession.aspx?CTID=customerId&CSDEST=SharePoint",
-    "variable": "customerId",
-    "target": "_blank",
-    "external": true,
-    "icon": "book"
+    "icon": "ShieldMoon"
   }
 ]

src/pages/cipp/settings/tenants.js

@@ -5,7 +5,7 @@ import tabOptions from "./tabOptions";
 import { Button, SvgIcon } from "@mui/material";
 import { CippApiDialog } from "/src/components/CippComponents/CippApiDialog";
 import { useDialog } from "/src/hooks/use-dialog";
-import { Sync } from "@mui/icons-material";
+import { Sync, Block, PlayArrow, RestartAlt, Delete, Add } from "@mui/icons-material";
 
 const Page = () => {
   const pageTitle = "Tenants - Backend";
@@ -17,6 +17,7 @@ const Page = () => {
       label: "Exclude Tenants",
       type: "POST",
       url: `/api/ExecExcludeTenant?AddExclusion=true`,
+      icon: <Block />,
       data: { value: "customerId" },
       confirmText: "Are you sure you want to exclude these tenants?",
       multiPost: false,
@@ -25,6 +26,7 @@ const Page = () => {
       label: "Include Tenants",
       type: "POST",
       url: `/api/ExecExcludeTenant?RemoveExclusion=true`,
+      icon: <Add />,
       data: { value: "customerId" },
       confirmText: "Are you sure you want to include these tenants?",
       multiPost: false,
@@ -33,6 +35,7 @@ const Page = () => {
       label: "Refresh CPV Permissions",
       type: "POST",
       url: `/api/ExecCPVPermissions`,
+      icon: <PlayArrow />,
       data: { TenantFilter: "customerId" },
       confirmText: "Are you sure you want to refresh the CPV permissions for these tenants?",
       multiPost: false,
@@ -41,6 +44,7 @@ const Page = () => {
       label: "Reset CPV Permissions",
       type: "POST",
       url: `/api/ExecCPVPermissions?&ResetSP=true`,
+      icon: <RestartAlt />,
       data: { TenantFilter: "customerId" },
       confirmText:
         "Are you sure you want to reset the CPV permissions for these tenants? (This will delete the Service Principal and re-add it.)",
@@ -50,6 +54,7 @@ const Page = () => {
       label: "Remove Tenant",
       type: "POST",
       url: `/api/ExecRemoveTenant`,
+      icon: <Delete />,
       data: { TenantID: "customerId" },
       confirmText: "Are you sure you want to remove this tenant?",
       multiPost: false,

src/pages/email/administration/contacts/index.js

@@ -1,6 +1,6 @@
 import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import { CippTablePage } from "/src/components/CippComponents/CippTablePage.jsx";
-import { Edit } from "@mui/icons-material";
+import { Edit, PersonAdd } from "@mui/icons-material";
 import { Button } from "@mui/material";
 import Link from "next/link";
 import TrashIcon from '@heroicons/react/24/outline/TrashIcon';
@@ -40,7 +40,11 @@ const Page = () => {
       simpleColumns={simpleColumns}
       cardButton={
         <>
-          <Button component={Link} href="/email/administration/contacts/add">
+          <Button
+            component={Link}
+            href="/email/administration/contacts/add"
+            startIcon={<PersonAdd />}
+          >
             Add contact
           </Button>
         </>

src/pages/email/administration/mailboxes/index.js

@@ -2,6 +2,7 @@ import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import { CippTablePage } from "/src/components/CippComponents/CippTablePage.jsx";
 import Link from "next/link";
 import { Button } from "@mui/material";
+import { Add } from "@mui/icons-material";
 
 import {
   Archive,
@@ -269,7 +270,11 @@ const Page = () => {
       filters={filterList}
       cardButton={
         <>
-          <Button component={Link} href="/email/administration/mailboxes/addshared">
+          <Button
+            component={Link}
+            startIcon={<Add />}
+            href="/email/administration/mailboxes/addshared"
+          >
             Add Shared Mailbox
           </Button>
         </>

src/pages/email/administration/tenant-allow-block-lists/index.js

@@ -2,7 +2,8 @@ import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import { CippTablePage } from "/src/components/CippComponents/CippTablePage.jsx";
 import { Button } from "@mui/material";
 import Link from "next/link";
-import TrashIcon from '@heroicons/react/24/outline/TrashIcon';
+import TrashIcon from "@heroicons/react/24/outline/TrashIcon";
+import { PlaylistAdd } from "@mui/icons-material";
 
 const Page = () => {
   const pageTitle = "Tenant Allow/Block Lists";
@@ -50,7 +51,11 @@ const Page = () => {
       }}
       cardButton={
         <>
-          <Button component={Link} href="/email/administration/tenant-allow-block-lists/add">
+          <Button
+            component={Link}
+            href="/email/administration/tenant-allow-block-lists/add"
+            startIcon={<PlaylistAdd />}
+          >
             Add Entry
           </Button>
         </>

src/pages/email/resources/management/list-rooms/index.js

@@ -2,6 +2,7 @@ import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import { CippTablePage } from "/src/components/CippComponents/CippTablePage.jsx";
 import { Button } from "@mui/material";
 import Link from "next/link";
+import { AddHomeWork } from "@mui/icons-material";
 
 const Page = () => {
   const pageTitle = "Rooms";
@@ -12,7 +13,11 @@ const Page = () => {
       apiUrl="/api/ListRooms"
       simpleColumns={["displayName", "building", "floorNumber", "capacity", "bookingType"]}
       cardButton={
-        <Button component={Link} href="/email/resources/management/list-rooms/add">
+        <Button
+          component={Link}
+          href="/email/resources/management/list-rooms/add"
+          startIcon={<AddHomeWork />}
+        >
           Add Room
         </Button>
       }

src/pages/email/resources/management/room-lists/index.js

@@ -1,15 +1,17 @@
 import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import { CippTablePage } from "/src/components/CippComponents/CippTablePage.jsx";
+import { Visibility } from "@mui/icons-material";
 
 const Page = () => {
   const pageTitle = "Room Lists";
-  const apiUrl = "/api/ListRoomLists"
+  const apiUrl = "/api/ListRoomLists";
 
   const actions = [
     {
       label: "View included Rooms",
       link: `/email/resources/management/room-lists/list/view?roomAddress=[emailAddress]`,
       color: "info",
+      icon: <Visibility />,
     },
   ];
 

src/pages/email/spamfilter/list-connectionfilter/index.js

@@ -1,7 +1,7 @@
 import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import { CippTablePage } from "/src/components/CippComponents/CippTablePage.jsx";
 import { Button } from "@mui/material";
-import { Book } from "@mui/icons-material";
+import { Book, AddModerator } from "@mui/icons-material";
 import Link from "next/link";
 
 const Page = () => {
@@ -45,7 +45,11 @@ const Page = () => {
       simpleColumns={simpleColumns}
       cardButton={
         <>
-          <Button component={Link} href="/email/spamfilter/list-connectionfilter/add">
+          <Button
+            component={Link}
+            href="/email/spamfilter/list-connectionfilter/add"
+            startIcon={<AddModerator />}
+          >
             Deploy ConnectionFilter
           </Button>
         </>

src/pages/email/spamfilter/list-spamfilter/index.js

@@ -4,6 +4,7 @@ import { Button } from "@mui/material";
 import { Book, Block, Check } from "@mui/icons-material";
 import { TrashIcon } from "@heroicons/react/24/outline";
 import Link from "next/link";
+import { RocketLaunch } from "@mui/icons-material";
 
 const Page = () => {
   const pageTitle = "Spam Filters";
@@ -100,7 +101,11 @@ const Page = () => {
       simpleColumns={simpleColumns}
       cardButton={
         <>
-          <Button component={Link} href="/email/spamfilter/list-spamfilter/add">
+          <Button
+            component={Link}
+            href="/email/spamfilter/list-spamfilter/add"
+            startIcon={<RocketLaunch />}
+          >
             Deploy Spamfilter
           </Button>
         </>