@omersx/bemms 0.0.0-stage → 1.0.0

package/src/components/admin/settings-forms/security-form.tsx

@@ -0,0 +1,186 @@
+'use client';
+
+import { useState } from 'react';
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card';
+import { Label } from '@/components/ui/label';
+import { Input } from '@/components/ui/input';
+import { Button } from '@/components/ui/button';
+import { Switch } from '@/components/ui/switch';
+import { ShieldCheck, Lock, KeyRound, AlertTriangle, Loader2, Save } from 'lucide-react';
+import { toast } from 'sonner';
+import { updateOrganizationSettings } from '@/lib/actions/system-settings';
+import type { SecuritySettings } from '@/lib/validators/system-settings';
+
+interface SecurityFormProps {
+  initialData: SecuritySettings;
+  organizationId: string;
+}
+
+export function SecurityForm({ initialData, organizationId }: SecurityFormProps) {
+  const [formData, setFormData] = useState<SecuritySettings>(initialData);
+  const [changeReason, setChangeReason] = useState('');
+  const [saving, setSaving] = useState(false);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setSaving(true);
+
+    try {
+      const res = await updateOrganizationSettings({
+        organizationId,
+        section: 'security',
+        settings: formData,
+        changeReason: changeReason.trim() || 'Updated security and compliance policies',
+      });
+
+      if (res.success) {
+        toast.success('Security settings saved successfully');
+        setChangeReason('');
+      } else {
+        toast.error(res.error || 'Failed to update security settings');
+      }
+    } catch {
+      toast.error('An unexpected error occurred');
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  return (
+    <form onSubmit={handleSubmit}>
+      <Card>
+        <CardHeader>
+          <CardTitle className="flex items-center gap-2 text-xl">
+            <ShieldCheck className="h-5 w-5 text-primary" />
+            Security & 21 CFR Part 11 Compliance
+          </CardTitle>
+          <CardDescription>
+            Configure authentication thresholds, inactivity timeouts, and electronic signature safeguards.
+          </CardDescription>
+        </CardHeader>
+
+        <CardContent className="space-y-6">
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+            {/* Session Timeout */}
+            <div className="space-y-2">
+              <Label htmlFor="sessionTimeout" className="flex items-center gap-2">
+                <Lock className="h-4 w-4 text-muted-foreground" />
+                Session Inactivity Timeout (Minutes)
+              </Label>
+              <Input
+                id="sessionTimeout"
+                type="number"
+                min={5}
+                max={1440}
+                value={formData.sessionTimeoutMinutes}
+                onChange={(e) =>
+                  setFormData((prev) => ({ ...prev, sessionTimeoutMinutes: parseInt(e.target.value) || 30 }))
+                }
+              />
+              <p className="text-xs text-muted-foreground">
+                Inactivity duration before active user sessions are terminated automatically (standard: 15-30m).
+              </p>
+            </div>
+
+            {/* Password Expiry */}
+            <div className="space-y-2">
+              <Label htmlFor="passwordExpiry" className="flex items-center gap-2">
+                <KeyRound className="h-4 w-4 text-muted-foreground" />
+                Password Expiration Policy (Days)
+              </Label>
+              <Input
+                id="passwordExpiry"
+                type="number"
+                min={0}
+                max={365}
+                value={formData.passwordExpiryDays}
+                onChange={(e) =>
+                  setFormData((prev) => ({ ...prev, passwordExpiryDays: parseInt(e.target.value) || 0 }))
+                }
+              />
+              <p className="text-xs text-muted-foreground">
+                Set to 0 to disable automated expiry, or specify hospital policy interval (e.g., 90 days).
+              </p>
+            </div>
+
+            {/* Max Login Attempts */}
+            <div className="space-y-2">
+              <Label htmlFor="maxAttempts" className="flex items-center gap-2">
+                <AlertTriangle className="h-4 w-4 text-muted-foreground" />
+                Max Failed Login Attempts
+              </Label>
+              <Input
+                id="maxAttempts"
+                type="number"
+                min={3}
+                max={10}
+                value={formData.maxLoginAttempts}
+                onChange={(e) =>
+                  setFormData((prev) => ({ ...prev, maxLoginAttempts: parseInt(e.target.value) || 5 }))
+                }
+              />
+              <p className="text-xs text-muted-foreground">
+                Account lockout threshold to prevent brute-force attacks.
+              </p>
+            </div>
+
+            {/* Re-auth for Signatures */}
+            <div className="flex flex-col justify-between space-y-2 p-4 border rounded-lg bg-muted/20">
+              <div className="flex items-center justify-between">
+                <div className="space-y-0.5 pr-4">
+                  <Label htmlFor="requireReAuth" className="font-medium text-sm">
+                    Re-Authenticate for Electronic Signatures
+                  </Label>
+                  <p className="text-xs text-muted-foreground">
+                    Enforces password/PIN re-entry when signing maintenance release and calibration records (FDA 21 CFR Part 11).
+                  </p>
+                </div>
+                <Switch
+                  id="requireReAuth"
+                  checked={formData.requireReAuthForSignatures}
+                  onCheckedChange={(val) =>
+                    setFormData((prev) => ({ ...prev, requireReAuthForSignatures: val }))
+                  }
+                />
+              </div>
+            </div>
+          </div>
+
+          {/* Audit Trace Reason */}
+          <div className="space-y-2 pt-2 border-t">
+            <Label htmlFor="changeReason" className="text-sm font-medium">
+              Change Reason (21 CFR Part 11 Audit Trace)
+            </Label>
+            <Input
+              id="changeReason"
+              placeholder="e.g., Hospital IT security policy annual review"
+              value={changeReason}
+              onChange={(e) => setChangeReason(e.target.value)}
+              className="max-w-xl"
+            />
+            <p className="text-xs text-muted-foreground">
+              Required reason for modifying clinical and infrastructure security parameters.
+            </p>
+          </div>
+        </CardContent>
+
+        <CardFooter className="flex justify-end border-t pt-4">
+          <Button type="submit" disabled={saving} className="gap-2">
+            {saving ? (
+              <>
+                <Loader2 className="h-4 w-4 animate-spin" />
+                Saving...
+              </>
+            ) : (
+              <>
+                <Save className="h-4 w-4" />
+                Save Security Settings
+              </>
+            )}
+          </Button>
+        </CardFooter>
+      </Card>
+    </form>
+  );
+}
+

package/src/components/admin/system-settings-tabs.tsx

@@ -0,0 +1,88 @@
+'use client';
+
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
+import { Globe, ShieldCheck, Database, Activity, Sliders } from 'lucide-react';
+import { LocalizationForm } from './settings-forms/localization-form';
+import { SecurityForm } from './settings-forms/security-form';
+import { RetentionForm } from './settings-forms/retention-form';
+import { HealthPanel } from './settings-forms/health-panel';
+import { FeaturesForm } from './settings-forms/features-form';
+import type { SystemSettings } from '@/lib/validators/system-settings';
+import type { SystemHealthData } from '@/lib/actions/system-settings';
+
+interface SystemSettingsTabsProps {
+  settings: SystemSettings;
+  organizationId: string;
+  organizationName?: string;
+  healthData: SystemHealthData;
+}
+
+export function SystemSettingsTabs({
+  settings,
+  organizationId,
+  organizationName,
+  healthData,
+}: SystemSettingsTabsProps) {
+  return (
+    <div className="space-y-6">
+      <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-2">
+        <div>
+          <h1 className="text-2xl font-bold tracking-tight">System Settings</h1>
+          <p className="text-sm text-muted-foreground">
+            Configure system policies, localization, security rules, and data retention
+            {organizationName ? ` for ${organizationName}` : ''}.
+          </p>
+        </div>
+      </div>
+
+      <Tabs defaultValue="localization" className="space-y-6">
+        <TabsList className="grid grid-cols-2 md:grid-cols-5 w-full h-auto p-1 gap-1">
+          <TabsTrigger value="localization" className="flex items-center gap-2 py-2">
+            <Globe className="h-4 w-4" />
+            <span className="hidden sm:inline">Localization</span>
+            <span className="sm:hidden">Locale</span>
+          </TabsTrigger>
+          <TabsTrigger value="security" className="flex items-center gap-2 py-2">
+            <ShieldCheck className="h-4 w-4" />
+            <span>Security</span>
+          </TabsTrigger>
+          <TabsTrigger value="retention" className="flex items-center gap-2 py-2">
+            <Database className="h-4 w-4" />
+            <span className="hidden sm:inline">Data Retention</span>
+            <span className="sm:hidden">Retention</span>
+          </TabsTrigger>
+          <TabsTrigger value="features" className="flex items-center gap-2 py-2">
+            <Sliders className="h-4 w-4" />
+            <span>Features</span>
+          </TabsTrigger>
+          <TabsTrigger value="health" className="flex items-center gap-2 py-2">
+            <Activity className="h-4 w-4" />
+            <span className="hidden sm:inline">System Health</span>
+            <span className="sm:hidden">Health</span>
+          </TabsTrigger>
+        </TabsList>
+
+        <TabsContent value="localization" className="space-y-4">
+          <LocalizationForm initialData={settings.localization} organizationId={organizationId} />
+        </TabsContent>
+
+        <TabsContent value="security" className="space-y-4">
+          <SecurityForm initialData={settings.security} organizationId={organizationId} />
+        </TabsContent>
+
+        <TabsContent value="retention" className="space-y-4">
+          <RetentionForm initialData={settings.retention} organizationId={organizationId} />
+        </TabsContent>
+
+        <TabsContent value="features" className="space-y-4">
+          <FeaturesForm initialData={settings.features} organizationId={organizationId} />
+        </TabsContent>
+
+        <TabsContent value="health" className="space-y-4">
+          <HealthPanel initialData={healthData} />
+        </TabsContent>
+      </Tabs>
+    </div>
+  );
+}
+

package/src/components/admin/user-role-dialog.tsx

@@ -0,0 +1,293 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+  DialogFooter,
+  DialogDescription,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { Label } from "@/components/ui/label";
+import { Plus, Trash2, Loader2, ShieldCheck, AlertCircle } from "lucide-react";
+import { assignUserRole, revokeUserRole } from "@/lib/actions/users";
+
+interface RoleOption {
+  id: string;
+  code: string;
+  name: string;
+  description?: string | null;
+}
+
+interface AssignedRole {
+  id: string;
+  assignmentId: string;
+  code: string;
+  name: string;
+  description?: string | null;
+}
+
+interface UserRoleDialogProps {
+  userId: string;
+  assignedRoles: AssignedRole[];
+  availableRoles: RoleOption[];
+}
+
+export function UserRoleDialog({
+  userId,
+  assignedRoles,
+  availableRoles,
+}: UserRoleDialogProps) {
+  const router = useRouter();
+
+  // Assign Role State
+  const [assignOpen, setAssignOpen] = useState(false);
+  const [selectedRoleId, setSelectedRoleId] = useState("");
+  const [assignLoading, setAssignLoading] = useState(false);
+  const [assignError, setAssignError] = useState("");
+
+  // Revoke Role State
+  const [revokeOpen, setRevokeOpen] = useState(false);
+  const [roleToRevoke, setRoleToRevoke] = useState<AssignedRole | null>(null);
+  const [revokeLoading, setRevokeLoading] = useState(false);
+  const [revokeError, setRevokeError] = useState("");
+
+  // Filter out roles already assigned
+  const unassignedRoles = availableRoles.filter(
+    (role) => !assignedRoles.some((ar) => ar.id === role.id || ar.code === role.code)
+  );
+
+  const handleAssignRole = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!selectedRoleId) {
+      setAssignError("Please select a role to assign.");
+      return;
+    }
+
+    setAssignLoading(true);
+    setAssignError("");
+
+    try {
+      const result = await assignUserRole({
+        userId,
+        roleId: selectedRoleId,
+      });
+
+      if (result.success) {
+        setAssignOpen(false);
+        setSelectedRoleId("");
+        router.refresh();
+      } else {
+        setAssignError((result as any)?.error || "Failed to assign role");
+      }
+    } catch (err: any) {
+      setAssignError(err?.message || "An unexpected error occurred");
+    } finally {
+      setAssignLoading(false);
+    }
+  };
+
+  const handleRevokeRole = async () => {
+    if (!roleToRevoke) return;
+
+    setRevokeLoading(true);
+    setRevokeError("");
+
+    try {
+      const result = await revokeUserRole(roleToRevoke.assignmentId);
+
+      if (result.success) {
+        setRevokeOpen(false);
+        setRoleToRevoke(null);
+        router.refresh();
+      } else {
+        setRevokeError((result as any)?.error || "Failed to revoke role");
+      }
+    } catch (err: any) {
+      setRevokeError(err?.message || "An unexpected error occurred");
+    } finally {
+      setRevokeLoading(false);
+    }
+  };
+
+  return (
+    <div className="space-y-4">
+      {/* ── Assign Role Trigger ── */}
+      <div className="flex justify-end">
+        <Dialog open={assignOpen} onOpenChange={setAssignOpen}>
+          <DialogTrigger asChild>
+            <Button size="sm" className="gap-1.5 min-h-[36px]">
+              <Plus className="w-4 h-4" />
+              Assign Role
+            </Button>
+          </DialogTrigger>
+          <DialogContent className="sm:max-w-[450px]">
+            <form onSubmit={handleAssignRole} className="space-y-4">
+              <DialogHeader>
+                <DialogTitle className="flex items-center gap-2">
+                  <ShieldCheck className="w-5 h-5 text-primary" />
+                  Assign System Role
+                </DialogTitle>
+                <DialogDescription className="text-xs">
+                  Grant operational or administrative access permissions to this user.
+                </DialogDescription>
+              </DialogHeader>
+
+              {assignError && (
+                <div className="bg-destructive/10 text-destructive text-xs p-2.5 rounded-md border border-destructive/20">
+                  {assignError}
+                </div>
+              )}
+
+              <div className="space-y-2">
+                <Label htmlFor="role-select" className="text-xs font-medium">
+                  Select Role *
+                </Label>
+                {unassignedRoles.length > 0 ? (
+                  <select
+                    id="role-select"
+                    value={selectedRoleId}
+                    onChange={(e) => setSelectedRoleId(e.target.value)}
+                    className="w-full rounded-md border border-input bg-background px-3 py-2 text-sm"
+                    required
+                  >
+                    <option value="">Choose a role...</option>
+                    {unassignedRoles.map((role) => (
+                      <option key={role.id} value={role.id}>
+                        {role.name} ({role.code})
+                      </option>
+                    ))}
+                  </select>
+                ) : (
+                  <p className="text-xs text-muted-foreground italic p-2 border rounded bg-muted/20">
+                    All available system roles have already been assigned to this user.
+                  </p>
+                )}
+
+                {selectedRoleId && (
+                  <p className="text-xs text-muted-foreground pt-1">
+                    {unassignedRoles.find((r) => r.id === selectedRoleId)?.description}
+                  </p>
+                )}
+              </div>
+
+              <DialogFooter className="gap-2 sm:gap-0 pt-2">
+                <Button
+                  type="button"
+                  variant="outline"
+                  size="sm"
+                  onClick={() => setAssignOpen(false)}
+                  disabled={assignLoading}
+                >
+                  Cancel
+                </Button>
+                <Button
+                  type="submit"
+                  size="sm"
+                  disabled={assignLoading || unassignedRoles.length === 0}
+                >
+                  {assignLoading && <Loader2 className="w-3.5 h-3.5 mr-1.5 animate-spin" />}
+                  Confirm Assignment
+                </Button>
+              </DialogFooter>
+            </form>
+          </DialogContent>
+        </Dialog>
+      </div>
+
+      {/* ── Assigned Roles List ── */}
+      {assignedRoles.length > 0 ? (
+        <div className="space-y-3">
+          {assignedRoles.map((role) => (
+            <div
+              key={role.assignmentId || role.id}
+              className="flex items-center justify-between p-3.5 rounded-lg border bg-card hover:bg-muted/20 transition-colors"
+            >
+              <div className="space-y-0.5 min-w-0 pr-4">
+                <div className="flex items-center gap-2">
+                  <span className="font-semibold text-sm">{role.name}</span>
+                  <span className="font-mono text-[10px] uppercase px-1.5 py-0.5 rounded bg-muted text-muted-foreground border">
+                    {role.code}
+                  </span>
+                </div>
+                {role.description && (
+                  <p className="text-xs text-muted-foreground truncate">{role.description}</p>
+                )}
+              </div>
+
+              <Button
+                type="button"
+                variant="ghost"
+                size="sm"
+                className="text-red-500 hover:text-red-700 hover:bg-red-50 shrink-0 h-8 gap-1 text-xs"
+                onClick={() => {
+                  setRoleToRevoke(role);
+                  setRevokeOpen(true);
+                }}
+              >
+                <Trash2 className="w-3.5 h-3.5" />
+                Revoke
+              </Button>
+            </div>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8 text-sm text-muted-foreground border border-dashed rounded-lg">
+          No roles assigned yet. Click &quot;Assign Role&quot; above to grant permissions.
+        </div>
+      )}
+
+      {/* ── Revoke Confirmation Dialog ── */}
+      <Dialog open={revokeOpen} onOpenChange={setRevokeOpen}>
+        <DialogContent className="sm:max-w-[420px]">
+          <DialogHeader>
+            <div className="flex items-center gap-2">
+              <div className="p-2 rounded-full bg-red-100 text-red-600">
+                <AlertCircle className="w-5 h-5" />
+              </div>
+              <DialogTitle>Revoke Role</DialogTitle>
+            </div>
+            <DialogDescription className="text-xs pt-1">
+              Are you sure you want to revoke the{" "}
+              <strong className="text-foreground">{roleToRevoke?.name}</strong> role? The user will
+              immediately lose the privileges associated with this role.
+            </DialogDescription>
+          </DialogHeader>
+
+          {revokeError && (
+            <div className="bg-destructive/10 text-destructive text-xs p-2.5 rounded-md border border-destructive/20">
+              {revokeError}
+            </div>
+          )}
+
+          <DialogFooter className="gap-2 sm:gap-0 pt-2">
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              onClick={() => setRevokeOpen(false)}
+              disabled={revokeLoading}
+            >
+              Cancel
+            </Button>
+            <Button
+              type="button"
+              variant="destructive"
+              size="sm"
+              onClick={handleRevokeRole}
+              disabled={revokeLoading}
+            >
+              {revokeLoading && <Loader2 className="w-3.5 h-3.5 mr-1.5 animate-spin" />}
+              Confirm Revocation
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </div>
+  );
+}
+