diff --git a/src/components/pengaturan/akses-dan-tim.tsx b/src/components/pengaturan/akses-dan-tim.tsx
index 80a8004..a9b429a 100644
--- a/src/components/pengaturan/akses-dan-tim.tsx
+++ b/src/components/pengaturan/akses-dan-tim.tsx
@@ -1,12 +1,15 @@
import {
ActionIcon,
Alert,
+ Box,
Button,
Card,
Group,
Modal,
Select,
Space,
+ Stack,
+ Switch,
Table,
Text,
TextInput,
@@ -23,167 +26,63 @@ import {
import { useState } from "react";
const AksesDanTimSettings = () => {
- const [opened, setOpened] = useState(false);
- const { colorScheme } = useMantineColorScheme();
- const dark = colorScheme === "dark";
-
- // Sample team members data
- const teamMembers = [
- {
- id: 1,
- name: "Admin Utama",
- email: "admin@desa.go.id",
- role: "Administrator",
- status: "Aktif",
- },
- {
- id: 2,
- name: "Operator Desa",
- email: "operator@desa.go.id",
- role: "Operator",
- status: "Aktif",
- },
- {
- id: 3,
- name: "Staff Keuangan",
- email: "keuangan@desa.go.id",
- role: "Keuangan",
- status: "Aktif",
- },
- {
- id: 4,
- name: "Staff Umum",
- email: "umum@desa.go.id",
- role: "Umum",
- status: "Nonaktif",
- },
- ];
-
- const roles = [
- { value: "administrator", label: "Administrator" },
- { value: "operator", label: "Operator" },
- { value: "keuangan", label: "Keuangan" },
- { value: "umum", label: "Umum" },
- { value: "keamanan", label: "Keamanan" },
- ];
-
return (
-
- setOpened(false)}
- title="Tambah Anggota Tim"
- size="lg"
- >
-
-
-
-
-
-
-
-
-
-
- Akses & Tim
-
-
- Kelola akses dan anggota tim Anda
-
-
-
-
-
- Anggota Tim
- }
- onClick={() => setOpened(true)}
- >
- Tambah Anggota
-
-
-
-
-
-
- Nama
- Email
- Peran
- Status
- Aksi
-
-
-
- {teamMembers.map((member) => (
-
-
-
-
- {member.name}
-
-
- {member.email}
-
- {member.role}
-
-
-
- {member.status}
-
-
-
-
-
-
-
-
-
-
-
-
-
- ))}
-
-
-
-
-
- }
- title="Informasi"
- color="blue"
- mb="md"
- >
- Administrator memiliki akses penuh ke semua fitur. Peran lainnya
- memiliki akses terbatas sesuai kebutuhan.
-
-
-
+
+
+
+ Manajemen Tim
+
+
+
+
+ Daftar Anggota Teraktif
+ 12 Anggota
+
+
+
+
+
+
+ Hak Akses
+
+
+ Administrator
+ 2 Orang
+
+
+ Editor
+ 5 Orang
+
+
+ Viewer
+ 5 Orang
+
+
+
+
+
+
+ Kolaborasi
+
+
+ Izin Export Data
+
+
+
+ Require Approval Untuk Perubahan
+
+
+
+
+
-
+
);
};
diff --git a/src/components/pengaturan/keamanan.tsx b/src/components/pengaturan/keamanan.tsx
index 23eda15..56b25dd 100644
--- a/src/components/pengaturan/keamanan.tsx
+++ b/src/components/pengaturan/keamanan.tsx
@@ -1,89 +1,65 @@
import {
- Alert,
Button,
- Card,
+ Box,
Group,
- PasswordInput,
- Space,
+ Stack,
Switch,
Text,
- Title,
- useMantineColorScheme,
+ Title
} from "@mantine/core";
-import { IconInfoCircle, IconLock } from "@tabler/icons-react";
const KeamananSettings = () => {
- const { colorScheme } = useMantineColorScheme();
- const dark = colorScheme === "dark";
return (
-
-
- Pengaturan Keamanan
-
-
- Kelola keamanan akun Anda
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- }
- title="Keamanan"
- color="orange"
- mb="md"
- >
- Gunakan kata sandi yang kuat dan unik. Hindari menggunakan kata sandi
- yang sama di banyak layanan.
-
-
- }
- title="Informasi"
- color="blue"
- mb="md"
- >
- Setelah mengganti kata sandi, Anda akan diminta logout dari semua
- perangkat.
-
-
-
+
+
+
+ Autentikasi
+
+
+ Two-Factor Authentication
+
+
+
+ Biometrik Login
+
+
+
+ IP Whitelist
+
+
+
+
+
+
+
+ Password
+
+
+
+
+
+
+
+
+
+ Audit & Log
+
+
+ Log Aktivitas
+
+
+
+
+
+
-
+
-
+
);
};
diff --git a/src/components/pengaturan/notifikasi.tsx b/src/components/pengaturan/notifikasi.tsx
index 37cbd83..3b81c30 100644
--- a/src/components/pengaturan/notifikasi.tsx
+++ b/src/components/pengaturan/notifikasi.tsx
@@ -1,10 +1,14 @@
import {
Alert,
+ Box,
Button,
Card,
Checkbox,
+ Grid,
+ GridCol,
Group,
Space,
+ Stack,
Switch,
Text,
Title,
@@ -16,70 +20,82 @@ const NotifikasiSettings = () => {
const { colorScheme } = useMantineColorScheme();
const dark = colorScheme === "dark";
return (
-
-
- Pengaturan Notifikasi
-
-
- Kelola preferensi notifikasi Anda
-
-
-
-
-
-
- Metode Notifikasi
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Jenis Notifikasi
-
-
-
-
-
-
-
-
-
-
-
- }
- title="Tip"
- color="blue"
- mb="md"
- >
- Anda dapat menyesuaikan frekuensi notifikasi mingguan sesuai kebutuhan
- Anda.
-
-
-
+
+
+
+
+ Metode Notifikasi
+
+
+ Laporan Harian
+
+
+
+ Alert Sistem
+
+
+
+ Update Keamanan
+
+
+
+ Newsletter Bulanan
+
+
+
+
+
+
+
+ Preferensi Alert
+
+
+ Treshold Memori
+
+
+
+ Treshold CPU
+
+
+
+ Treshold Disk
+
+
+
+
+
+
+
+ Notifikasi Push
+
+
+ Alert Kritis
+
+
+
+ Aktivitas Tim
+
+
+
+ Komentar & Mention
+
+
+
+ Bunyi Notifikasi
+
+
+
+
+
+
-
+
);
};
diff --git a/src/components/pengaturan/umum.tsx b/src/components/pengaturan/umum.tsx
index ec5b814..f7482a5 100644
--- a/src/components/pengaturan/umum.tsx
+++ b/src/components/pengaturan/umum.tsx
@@ -1,23 +1,15 @@
import {
- Alert,
Box,
Button,
- Card,
Group,
Select,
- Space,
Switch,
Text,
- TextInput,
Title,
- useMantineColorScheme,
} from "@mantine/core";
import { DateInput } from "@mantine/dates";
-import { IconInfoCircle } from "@tabler/icons-react";
const UmumSettings = () => {
- const { colorScheme } = useMantineColorScheme();
- const dark = colorScheme === "dark";
return (
{
setSidebarCollapsed.toggle();
+ setClickCount(0);
};
const handleMainClick = () => {
if (!sidebarCollapsed) {
- toggleSidebar();
+ const newCount = clickCount + 1;
+ setClickCount(newCount);
+
+ if (newCount === 2) {
+ toggleSidebar();
+ } else {
+ setTimeout(() => setClickCount(0), 300);
+ }
}
};
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index 84d9fd0..9f1c50e 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -1,6 +1,7 @@
import { AppShell, Burger, Group, useMantineColorScheme } from "@mantine/core";
import { useDisclosure } from "@mantine/hooks";
import { createFileRoute } from "@tanstack/react-router";
+import { useState } from "react";
import { DashboardContent } from "@/components/dashboard-content";
import { Header } from "@/components/header";
import { Sidebar } from "@/components/sidebar";
@@ -12,6 +13,7 @@ export const Route = createFileRoute("/")({
function DashboardPage() {
const [opened, { toggle }] = useDisclosure();
const [sidebarCollapsed, setSidebarCollapsed] = useDisclosure(false);
+ const [clickCount, setClickCount] = useState(0);
const { colorScheme } = useMantineColorScheme();
const headerBgColor = colorScheme === "dark" ? "#11192D" : "#19355E";
const navbarBgColor = colorScheme === "dark" ? "#11192D" : "white";
@@ -19,7 +21,15 @@ function DashboardPage() {
const handleMainClick = () => {
if (!sidebarCollapsed) {
- setSidebarCollapsed.toggle();
+ const newCount = clickCount + 1;
+ setClickCount(newCount);
+
+ if (newCount === 2) {
+ setSidebarCollapsed.toggle();
+ setClickCount(0);
+ } else {
+ setTimeout(() => setClickCount(0), 300);
+ }
}
};