Update admin icons

src/admin/AdminAppMenu.tsx

@@ -7,10 +7,10 @@ import {
   PATH_GRID_INFERRED,
 } from '@/app-core/paths';
 import { useAppState } from '@/state/AppState';
-import { BiCog } from 'react-icons/bi';
 import { ImCheckboxUnchecked } from 'react-icons/im';
 import { IoCloseSharp } from 'react-icons/io5';
 import AdminAppInsightsIcon from './insights/AdminAppInsightsIcon';
+import { LuCog } from 'react-icons/lu';
 
 export default function AdminAppMenu() {
   const {
@@ -24,13 +24,15 @@ export default function AdminAppMenu() {
     <MoreMenu
       items={[{
         label: 'Insights',
-        icon: <span className="scale-90 translate-y-[-3px]">
+        icon: <span className="scale-90 translate-y-[-2px]">
           <AdminAppInsightsIcon />
         </span>,
         href: PATH_ADMIN_INSIGHTS,
       }, {
         label: 'Configuration',
-        icon: <BiCog className="text-[17px]" />,
+        icon: <LuCog
+          className="text-[16px] translate-x-[0.5px]"
+        />,
         href: PATH_ADMIN_CONFIGURATION,
       }, {
         label: isSelecting
@@ -41,7 +43,7 @@ export default function AdminAppMenu() {
             className="text-[18px] translate-y-[-0.5px]"
           />
           : <ImCheckboxUnchecked
-            className="text-[0.75rem]"
+            className="text-[0.75rem] translate-x-[0.5px]"
           />,
         href: PATH_GRID_INFERRED,
         action: () => {

src/admin/AdminNavClient.tsx

@@ -19,8 +19,8 @@ import { differenceInMinutes } from 'date-fns';
 import { usePathname } from 'next/navigation';
 import { useEffect, useMemo, useState } from 'react';
 import { FaRegClock } from 'react-icons/fa';
-import { HiOutlineCog } from 'react-icons/hi';
 import AdminAppInsightsIcon from './insights/AdminAppInsightsIcon';
+import { LuCog } from 'react-icons/lu';
 
 // Updates considered recent if they occurred in past 5 minutes
 const areTimesRecent = (dates: Date[]) => dates
@@ -92,10 +92,12 @@ export default function AdminNavClient({
             <div className="flex gap-3">
               <LinkWithLoader
                 href={PATH_ADMIN_INSIGHTS}
-                className={isPathAdminInsights(pathname)
-                  ? 'font-bold'
-                  : 'text-dim'}
-                loader={<Spinner className="translate-y-[-1px]" />}
+                className={clsx(
+                  'translate-y-[-2px]',
+                  isPathAdminInsights(pathname)
+                    ? 'font-bold'
+                    : 'text-dim')}
+                loader={<Spinner className="translate-y-[1px]" />}
               >
                 <AdminAppInsightsIcon />
               </LinkWithLoader>
@@ -106,7 +108,7 @@ export default function AdminNavClient({
                   : 'text-dim'}
                 loader={<Spinner className="translate-y-[-0.75px]" />}
               >
-                <HiOutlineCog
+                <LuCog
                   size={20}
                   className="inline-flex translate-y-[1px]"
                   aria-label="App Configuration"

src/admin/insights/AdminAppInsightsIcon.tsx

@@ -1,5 +1,5 @@
 import clsx from 'clsx/lite';
-import { FaInfo } from 'react-icons/fa';
+import { LuLightbulb } from 'react-icons/lu';
 
 export default function AdminAppInsightsIcon({
   indicator = 'blue',
@@ -8,20 +8,13 @@ export default function AdminAppInsightsIcon({
 }) {
   return (
     <span className="inline-flex relative">
-      <span className={clsx(
-        'size-[16px]',
-        'inline-flex items-center justify-center',
-        'border-[1.5px] border-current rounded-[6px]',
-        'translate-y-[3px]',
-      )}>
-        <FaInfo
-          size={8}
-          aria-label="App Configuration"
-        />
-      </span>
+      <LuLightbulb
+        size={19}
+        className="translate-y-[3px]"
+      />
       {indicator && <span className={clsx(
         'absolute',
-        'top-[0.5px] right-[-2.5px]',
+        'top-[2px] right-[0.5px]',
         'size-2 rounded-full',
         indicator === 'yellow'
           ? 'bg-amber-500'