Fix array fill logicl; allow matching on any permissions

Author: DaneEveritt

resources/scripts/components/elements/Can.tsx

@@ -3,16 +3,26 @@ import { usePermissions } from '@/plugins/usePermissions';
 
 interface Props {
     action: string | string[];
+    matchAny?: boolean;
     renderOnError?: React.ReactNode | null;
     children: React.ReactNode;
 }
 
-const Can = ({ action, renderOnError, children }: Props) => {
+const Can = ({ action, matchAny = false, renderOnError, children }: Props) => {
     const can = usePermissions(action);
 
+    if (matchAny) {
+        console.log('Can.tsx', can);
+    }
+
     return (
         <>
-            {can.every(p => p) ? children : renderOnError}
+            {
+                ((matchAny && can.filter(p => p).length > 0) || (!matchAny && can.every(p => p))) ?
+                    children
+                    :
+                    renderOnError
+            }
         </>
     );
 };

resources/scripts/plugins/usePermissions.ts

@@ -6,9 +6,7 @@ export const usePermissions = (action: string | string[]): boolean[] => {
 
     return useDeepMemo(() => {
         if (userPermissions[0] === '*') {
-            return ([] as boolean[]).fill(
-                true, 0, Array.isArray(action) ? action.length : 1,
-            );
+            return Array(Array.isArray(action) ? action.length : 1).fill(true);
         }
 
         return (Array.isArray(action) ? action : [ action ])

resources/scripts/routers/ServerRouter.tsx

@@ -47,7 +47,7 @@ const ServerRouter = ({ match, location }: RouteComponentProps<{ id: string }>)
                         <Can action={'user.*'}>
                             <NavLink to={`${match.url}/users`}>Users</NavLink>
                         </Can>
-                        <Can action={'settings.*'}>
+                        <Can action={['settings.*', 'file.sftp']} matchAny={true}>
                             <NavLink to={`${match.url}/settings`}>Settings</NavLink>
                         </Can>
                     </div>