feature: Added Ldap Role Mapping

limanmys · Apr 29, 2024 · a5f3e72 · a5f3e72
1 parent 967ce95
commit a5f3e72
Show file tree

Hide file tree

Showing 5 changed files with 330 additions and 75 deletions.
diff --git a/public/locales/en/components.json b/public/locales/en/components.json
@@ -1,42 +1,47 @@
 {
-    "table": {
-        "no_records": "No records",
-        "pagination": {
-            "selected": "selected.",
-            "page_size": "Page size",
-            "page": "Page",
-            "total": "Total",
-            "records": "records"
-        },
-        "toolbar": {
-            "clear_filters": "Clear Filters",
-            "view": "View",
-            "columns": "Columns",
-            "search_placeholder": "Search..."
-        },
-        "column": {
-            "asc": "Ascending",
-            "desc": "Descending",
-            "hide": "Hide"
-        }
+  "table": {
+    "no_records": "No records",
+    "pagination": {
+      "selected": "selected.",
+      "page_size": "Page size",
+      "page": "Page",
+      "total": "Total",
+      "records": "records"
     },
-    "select": {
-        "user": {
-            "search_placeholder": "Search user...",
-            "not_found": "User not found",
-            "select_placeholder": "Select user"
-        },
-        "server": {
-            "search_placeholder": "Search server...",
-            "not_found": "Server not found",
-            "select_placeholder": "Select server"
-        }
+    "toolbar": {
+      "clear_filters": "Clear Filters",
+      "view": "View",
+      "columns": "Columns",
+      "search_placeholder": "Search..."
     },
-    "transfer": {
-        "select_all": "Select all",
-        "search": "Search...",
-        "selected": "({{selected}}/{{total}} selected)",
-        "no_records": "No data",
-        "save": "Save"
+    "column": {
+      "asc": "Ascending",
+      "desc": "Descending",
+      "hide": "Hide"
     }
+  },
+  "select": {
+    "user": {
+      "search_placeholder": "Search user...",
+      "not_found": "User not found",
+      "select_placeholder": "Select user"
+    },
+    "server": {
+      "search_placeholder": "Search server...",
+      "not_found": "Server not found",
+      "select_placeholder": "Select server"
+    },
+    "role": {
+      "select_placeholder": "Select a role...",
+      "search_placeholder": "Search a role...",
+      "not_found": "No roles found."
+    }
+  },
+  "transfer": {
+    "select_all": "Select all",
+    "search": "Search...",
+    "selected": "({{selected}}/{{total}} selected)",
+    "no_records": "No data",
+    "save": "Save"
+  }
 }
diff --git a/public/locales/tr/components.json b/public/locales/tr/components.json
@@ -1,42 +1,47 @@
 {
-    "table": {
-        "no_records": "Kayıt yok",
-        "pagination": {
-            "selected": "seçildi.",
-            "page_size": "Sayfa boyutu",
-            "page": "Sayfa",
-            "total": "Toplam",
-            "records": "kayıt"
-        },
-        "toolbar": {
-            "clear_filters": "Filtreleri Temizle",
-            "view": "Görüntüleme",
-            "columns": "Sütunlar",
-            "search_placeholder": "Arama..."
-        },
-        "column": {
-            "asc": "Artan",
-            "desc": "Azalan",
-            "hide": "Gizle"
-        }
+  "table": {
+    "no_records": "Kayıt yok",
+    "pagination": {
+      "selected": "seçildi.",
+      "page_size": "Sayfa boyutu",
+      "page": "Sayfa",
+      "total": "Toplam",
+      "records": "kayıt"
     },
-    "select": {
-        "user": {
-            "search_placeholder": "Kullanıcı ara...",
-            "not_found": "Kullanıcı bulunamadı",
-            "select_placeholder": "Kullanıcı seçiniz"
-        },
-        "server": {
-            "search_placeholder": "Sunucu ara...",
-            "not_found": "Sunucu bulunamadı",
-            "select_placeholder": "Sunucu seçiniz"
-        }
+    "toolbar": {
+      "clear_filters": "Filtreleri Temizle",
+      "view": "Görüntüleme",
+      "columns": "Sütunlar",
+      "search_placeholder": "Arama..."
     },
-    "transfer": {
-        "select_all": "Tümünü seç",
-        "search": "Arama...",
-        "selected": "({{selected}}/{{total}} seçili)",
-        "no_records": "Veri yok",
-        "save": "Kaydet"
+    "column": {
+      "asc": "Artan",
+      "desc": "Azalan",
+      "hide": "Gizle"
     }
+  },
+  "select": {
+    "user": {
+      "search_placeholder": "Kullanıcı ara...",
+      "not_found": "Kullanıcı bulunamadı",
+      "select_placeholder": "Kullanıcı seçiniz"
+    },
+    "server": {
+      "search_placeholder": "Sunucu ara...",
+      "not_found": "Sunucu bulunamadı",
+      "select_placeholder": "Sunucu seçiniz"
+    },
+    "role": {
+      "select_placeholder": "Rol seçimi yapınız...",
+      "search_placeholder": "Rol arayın...",
+      "not_found": "Rol bulunamadı."
+    }
+  },
+  "transfer": {
+    "select_all": "Tümünü seç",
+    "search": "Arama...",
+    "selected": "({{selected}}/{{total}} seçili)",
+    "no_records": "Veri yok",
+    "save": "Kaydet"
+  }
 }
diff --git a/src/components/selectbox/role-select.tsx b/src/components/selectbox/role-select.tsx
@@ -0,0 +1,122 @@
+import * as React from "react"
+import { apiService } from "@/services"
+import { Check, ChevronsUpDown, FileInput } from "lucide-react"
+import { useTranslation } from "react-i18next"
+
+import { IRole } from "@/types/role"
+import { cn } from "@/lib/utils"
+import { Button } from "@/components/ui/button"
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+} from "@/components/ui/command"
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from "@/components/ui/popover"
+
+import { Icons } from "../ui/icons"
+import { ScrollArea } from "../ui/scroll-area"
+
+export function SelectRole({
+  defaultValue,
+  onValueChange,
+}: {
+  defaultValue: string
+  onValueChange: (value: string) => void
+}) {
+  const { t } = useTranslation("components")
+
+  const [open, setOpen] = React.useState(false)
+  const [value, setValue] = React.useState("")
+
+  const [roles, setRoles] = React.useState<IRole[]>([])
+  const [loading, setLoading] = React.useState(true)
+
+  React.useEffect(() => {
+    apiService
+      .getInstance()
+      .get("/settings/roles")
+      .then((res) => {
+        setRoles(res.data)
+      })
+      .finally(() => {
+        setLoading(false)
+      })
+  }, [])
+
+  React.useEffect(() => {
+    if (!defaultValue) return
+    setValue(defaultValue)
+  }, [defaultValue])
+
+  React.useEffect(() => {
+    onValueChange(value)
+  }, [value])
+
+  return (
+    <Popover open={open} onOpenChange={setOpen}>
+      <PopoverTrigger asChild>
+        <Button
+          role="combobox"
+          aria-expanded={open}
+          variant="outline"
+          size="sm"
+          className="ml-auto h-8 w-full justify-between lg:flex"
+          disabled={loading}
+        >
+          <div className="flex items-center">
+            <FileInput className="mr-2 size-4 shrink-0" />
+            {value ? (
+              roles.find((role) => role.id === value)?.name
+            ) : (
+              <span className="text-muted-foreground">
+                {t("select.role.select_placeholder")}
+              </span>
+            )}
+          </div>
+          {!loading && (
+            <ChevronsUpDown className="ml-2 size-4 shrink-0 opacity-50" />
+          )}
+          {loading && (
+            <Icons.spinner className="ml-2 size-4 shrink-0 animate-spin opacity-50" />
+          )}
+        </Button>
+      </PopoverTrigger>
+      <PopoverContent className="w-[var(--radix-popover-trigger-width)] min-w-[300px] p-0">
+        <Command>
+          <CommandInput placeholder={t("select.role.search_placeholder")} />
+          <CommandEmpty>{t("select.role.not_found")}</CommandEmpty>
+          <CommandList>
+            <ScrollArea className="h-[300px]">
+              <CommandGroup>
+                {roles.map((role) => (
+                  <CommandItem
+                    key={role.id}
+                    onSelect={() => {
+                      setValue(role.id === value ? "" : role.id)
+                      setOpen(false)
+                    }}
+                  >
+                    <Check
+                      className={cn(
+                        "mr-2 size-4",
+                        value === role.id ? "opacity-100" : "opacity-0"
+                      )}
+                    />
+                    {role.name}
+                  </CommandItem>
+                ))}
+              </CommandGroup>
+            </ScrollArea>
+          </CommandList>
+        </Command>
+      </PopoverContent>
+    </Popover>
+  )
+}