feat(permissions): implement fine-grained permission control

src/lang/en/metas.json

@@ -1,7 +1,13 @@
 {
   "path": "Path",
   "password": "Password",
-  "write": "Write",
+  "read_users": "Read Users",
+  "read_users_help": "Only selected users with the required permission can read this path.",
+  "write_users": "Write Users",
+  "write_users_help": "Only selected users with the required permission can write this path.",
+  "all_permitted_users": "All Permitted Users",
+  "write": "Write Content Bypass",
+  "write_help": "Bypasses user permission checks for content writes (create/upload/modify). **USE WITH CAUTION.**",
   "hide": "Hide",
   "readme": "Readme",
   "readme_help": "Render a markdown at the bottom, support content or link",

src/lang/en/users.json

@@ -3,7 +3,7 @@
     "see_hides": "Can see hiddens",
     "access_without_password": "Access without password",
     "offline_download": "Add offline download tasks",
-    "write": "Make dir or upload",
+    "write_content": "Write content (Create / Upload / Modify)",
     "rename": "Rename",
     "move": "Move",
     "copy": "Copy",

src/pages/home/folder/context-menu.tsx

@@ -5,13 +5,15 @@ import { HStack, Icon, Text, useColorMode, Image } from "@hope-ui/solid"
 import { operations } from "../toolbar/operations"
 import { For, Show } from "solid-js"
 import { bus, convertURL, notify } from "~/utils"
-import { ObjType, UserMethods, UserPermissions } from "~/types"
+import { ObjType, UserMethods } from "~/types"
 import {
   getSettingBool,
   haveSelected,
   me,
+  objStore,
   oneChecked,
   selectedObjs,
+  userCan,
 } from "~/store"
 import { players } from "../previews/video_box"
 import { BsPlayCircleFill } from "solid-icons/bs"
@@ -50,13 +52,10 @@ export const ContextMenu = () => {
       theme={colorMode() !== "dark" ? "light" : "dark"}
       style="z-index: var(--hope-zIndices-popover)"
     >
-      <For each={["rename", "move", "copy", "delete", "share"]}>
+      <For each={["rename", "move", "copy", "delete", "share"] as const}>
         {(name) => (
           <Item
-            hidden={() => {
-              const index = UserPermissions.findIndex((item) => item === name)
-              return isShare() || !UserMethods.can(me(), index)
-            }}
+            hidden={!userCan(name) || !objStore.write}
             onClick={() => {
               bus.emit("tool", name)
             }}
@@ -67,12 +66,10 @@ export const ContextMenu = () => {
       </For>
       <Item
         hidden={() => {
-          const index = UserPermissions.findIndex(
-            (item) => item === "decompress",
-          )
           return (
             isShare() ||
-            !UserMethods.can(me(), index) ||
+            !userCan("decompress") ||
+            !objStore.write ||
             selectedObjs().some((o) => o.is_dir) ||
             selectedObjs().some((o) => !isArchive(o.name))
           )

src/pages/home/previews/text-editor.tsx

@@ -59,7 +59,12 @@ function Editor(props: { data?: string | ArrayBuffer; contentType?: string }) {
           setValue(value)
         }}
       />
-      <Show when={userCan("write") || objStore.write}>
+      <Show
+        when={
+          objStore.write &&
+          (userCan("write_content") || objStore.write_content_bypass)
+        }
+      >
         <Button loading={loading()} onClick={onSave}>
           {t("global.save")}
         </Button>

src/pages/home/toolbar/Center.tsx

@@ -1,6 +1,13 @@
 import { Box, HStack, useColorModeValue } from "@hope-ui/solid"
 import { createMemo, For, Show } from "solid-js"
-import { checkboxOpen, haveSelected, objStore, selectAll, State } from "~/store"
+import {
+  checkboxOpen,
+  haveSelected,
+  objStore,
+  selectAll,
+  State,
+  userCan,
+} from "~/store"
 import { CopyLink } from "./CopyLink"
 import { CenterIcon } from "./Icon"
 import { bus } from "~/utils"
@@ -27,7 +34,7 @@ export const Center = () => {
           w="max-content"
           color="$neutral11"
           as={Motion.div}
-          initial={{ opacity: 0, scale: 0.9, x: "50% ", y: 10 }}
+          initial={{ opacity: 0, scale: 0.9, x: "50%", y: 10 }}
           animate={{ opacity: 1, scale: 1, x: "50%", y: 0 }}
           exit={{ opacity: 0, scale: 0.9 }}
           // @ts-ignore
@@ -43,26 +50,28 @@ export const Center = () => {
               backdropFilter: "blur(8px)",
             }}
           >
-            <Show when={!isShare()}>
+            <Show when={!isShare() && objStore.write}>
               <For
-                each={[
-                  "rename",
-                  "move",
-                  "copy",
-                  "delete",
-                  "share",
-                  "decompress",
-                ]}
+                each={
+                  [
+                    "rename",
+                    "move",
+                    "copy",
+                    "delete",
+                    "share",
+                    "decompress",
+                  ] as const
+                }
               >
                 {(name) => {
-                  return (
+                  return userCan(name) ? (
                     <CenterIcon
                       name={name}
                       onClick={() => {
                         bus.emit("tool", name)
                       }}
                     />
-                  )
+                  ) : null
                 }}
               </For>
             </Show>

src/pages/home/toolbar/CopyMove.tsx

@@ -8,7 +8,7 @@ import { CgFolderAdd } from "solid-icons/cg"
 import { UserMethods, UserPermissions } from "~/types"
 
 export const CreateFolderButton = (props: { handler?: FolderTreeHandler }) => {
-  if (!UserMethods.can(me(), UserPermissions.indexOf("write"))) {
+  if (!UserMethods.can(me(), UserPermissions.indexOf("write_content"))) {
     return null
   }
   const t = useT()

src/pages/home/toolbar/Right.tsx

@@ -68,10 +68,12 @@ export const Right = () => {
             />
             <Show
               when={
-                isFolder() && !isShare() && (userCan("write") || objStore.write)
+                isFolder() &&
+                !isShare() &&
+                (userCan("write_content") || objStore.write_content_bypass) &&
+                objStore.write
               }
             >
-              {/* <Add /> */}
               <RightIcon
                 as={operations.new_file.icon}
                 tips="new_file"
@@ -87,20 +89,38 @@ export const Right = () => {
                   bus.emit("tool", "mkdir")
                 }}
               />
+            </Show>
+            <Show
+              when={
+                isFolder() && !isShare() && userCan("move") && objStore.write
+              }
+            >
               <RightIcon
                 as={operations.recursive_move.icon}
                 tips="recursive_move"
                 onClick={() => {
                   bus.emit("tool", "recursiveMove")
                 }}
               />
+            </Show>
+            <Show
+              when={
+                isFolder() && !isShare() && userCan("delete") && objStore.write
+              }
+            >
               <RightIcon
                 as={operations.remove_empty_directory.icon}
                 tips="remove_empty_directory"
                 onClick={() => {
                   bus.emit("tool", "removeEmptyDirectory")
                 }}
               />
+            </Show>
+            <Show
+              when={
+                isFolder() && !isShare() && userCan("rename") && objStore.write
+              }
+            >
               <RightIcon
                 as={operations.batch_rename.icon}
                 tips="batch_rename"
@@ -109,6 +129,15 @@ export const Right = () => {
                   bus.emit("tool", "batchRename")
                 }}
               />
+            </Show>
+            <Show
+              when={
+                isFolder() &&
+                !isShare() &&
+                (userCan("write_content") || objStore.write_content_bypass) &&
+                objStore.write
+              }
+            >
               <RightIcon
                 as={AiOutlineCloudUpload}
                 tips="upload"
@@ -118,7 +147,12 @@ export const Right = () => {
               />
             </Show>
             <Show
-              when={isFolder() && !isShare() && userCan("offline_download")}
+              when={
+                isFolder() &&
+                !isShare() &&
+                userCan("offline_download") &&
+                objStore.write
+              }
             >
               <RightIcon
                 as={IoMagnetOutline}