Getting somewhere on subuser stuff, adds i18n packages

resources/scripts/components/server/users/PermissionEditor.tsx

@@ -1,10 +1,46 @@
 import React from 'react';
 import { SubuserPermission } from '@/state/server/subusers';
+import { useStoreState } from 'easy-peasy';
+import { ApplicationStore } from '@/state';
+import { useTranslation } from 'react-i18next';
 
 interface Props {
     defaultPermissions: SubuserPermission[];
 }
 
 export default ({ defaultPermissions }: Props) => {
-    return null;
+    const { t } = useTranslation('server.users');
+    const permissions = useStoreState((state: ApplicationStore) => state.permissions.data);
+
+    return (
+        <div>
+            {
+                permissions.map(permission => (
+                    <div className={'flex mb-2'} key={permission}>
+                        <input
+                            id={`permission_${permission}`}
+                            type={'checkbox'}
+                            name={'permissions[]'}
+                            value={permission}
+                            defaultChecked={defaultPermissions.indexOf(permission) >= 0}
+                        />
+                        <label
+                            htmlFor={`permission_${permission}`}
+                            className={'flex-1 ml-3 text-sm text-neutral-200 cursor-pointer'}
+                        >
+                            {permission}
+                            <p className={'text-xs text-neutral-300'} style={{ textTransform: 'none' }}>
+                                {t(`server.users:permissions.${permission.replace('.', '_')}`)}
+                            </p>
+                        </label>
+                    </div>
+                ))
+            }
+            <div className={'mt-4 flex justify-end'}>
+                <button className={'btn btn-primary btn-sm'}>
+                    Save Changes
+                </button>
+            </div>
+        </div>
+    );
 };