@frank-auth/react
Version:
Flexible and customizable React UI components for Frank Authentication
4 lines (3 loc) • 10.3 kB
JavaScript
'use client';
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("@heroui/react"),A=require("react"),B=require("../../../hooks/use-auth.cjs"),z=require("../../../hooks/use-config.cjs"),q=require("../../../hooks/use-session.cjs"),F=require("../../../hooks/use-user.cjs"),b=require("../../forms/password-field.cjs"),O=t=>t&&t.__esModule?t:{default:t},w=O(A);function H(t){const o=t?.device?.toLowerCase()||"",a=t?.os?.toLowerCase()||"";return o.includes("mobile")||a.includes("ios")||a.includes("android")?e.jsx("svg",{className:"w-5 h-5 text-default-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 18h.01M8 21h8a1 1 0 001-1V4a1 1 0 00-1-1H8a1 1 0 00-1 1v16a1 1 0 001 1z"})}):e.jsx("svg",{className:"w-5 h-5 text-default-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"})})}function D(t){if(!t)return"Never";const a=new Date().getTime()-t.getTime(),l=Math.floor(a/(1e3*60)),h=Math.floor(a/(1e3*60*60)),c=Math.floor(a/(1e3*60*60*24));return l<1?"Just now":l<60?`${l}m ago`:h<24?`${h}h ago`:`${c}d ago`}function E({onSuccess:t,onError:o,onClose:a,isOpen:l}){const{changePassword:h}=F.useUser(),[c,p]=w.default.useState(""),[n,u]=w.default.useState(""),[f,v]=w.default.useState(""),[x,m]=w.default.useState(!1),[g,C]=w.default.useState({});w.default.useEffect(()=>{l||(p(""),u(""),v(""),C({}))},[l]);const P=()=>{const i={};return c||(i.currentPassword="Current password is required"),n?n.length<8&&(i.newPassword="Password must be at least 8 characters"):i.newPassword="New password is required",f?n!==f&&(i.confirmPassword="Passwords do not match"):i.confirmPassword="Please confirm your new password",C(i),Object.keys(i).length===0},k=async i=>{if(i.preventDefault(),!!P())try{m(!0),await h({currentPassword:c,newPassword:n}),t("Password changed successfully"),a()}catch(y){const j=y instanceof Error?y.message:"Failed to change password";o(j)}finally{m(!1)}};return e.jsxs("form",{onSubmit:k,className:"space-y-4",children:[e.jsx(b.PasswordField,{label:"Current Password",placeholder:"Enter your current password",value:c,onChange:p,error:g.currentPassword,required:!0}),e.jsx(b.PasswordField,{label:"New Password",placeholder:"Enter your new password",value:n,onChange:u,error:g.newPassword,showStrength:!0,required:!0}),e.jsx(b.PasswordField,{label:"Confirm New Password",placeholder:"Confirm your new password",value:f,onChange:v,error:g.confirmPassword,required:!0}),e.jsxs("div",{className:"flex justify-end gap-2 pt-4",children:[e.jsx(s.Button,{variant:"light",onPress:a,isDisabled:x,children:"Cancel"}),e.jsx(s.Button,{type:"submit",color:"primary",isLoading:x,isDisabled:!c||!n||!f,children:"Change Password"})]})]})}function U({onSuccess:t,onError:o,showPasswordChange:a=!0,showSessionManagement:l=!0,showSecurityPreferences:h=!1,showActivityLog:c=!1,className:p="",isDisabled:n=!1,variant:u="bordered",size:f="md",customSections:v=[],hideSections:x=[]}){const{user:m}=B.useAuth(),{sessions:g,isCurrentDevice:C,hasMultipleSessions:P,revokeSession:k,revokeAllSessions:i}=q.useSession(),{components:y}=z.useConfig(),j=s.useDisclosure(),S=y.SecurityPanel;if(S)return e.jsx(S,{onSuccess:t,onError:o,showPasswordChange:a,showSessionManagement:l,showSecurityPreferences:h,showActivityLog:c,className:p,isDisabled:n,variant:u,size:f,customSections:v,hideSections:x});const M=async r=>{try{await k(r),t?.("Session revoked successfully")}catch(d){const N=d instanceof Error?d.message:"Failed to revoke session";o?.(N)}},L=async()=>{try{await i(!0),t?.("All other sessions revoked successfully")}catch(r){const d=r instanceof Error?r.message:"Failed to revoke sessions";o?.(d)}};return m?e.jsxs("div",{className:`space-y-6 ${p}`,children:[a&&!x.includes("password")&&e.jsxs(s.Card,{variant:u,children:[e.jsx(s.CardHeader,{children:e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"flex items-center justify-center w-10 h-10 bg-primary/10 rounded-lg",children:e.jsx("svg",{className:"w-5 h-5 text-primary",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"})})}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-md font-semibold",children:"Password"}),e.jsx("p",{className:"text-sm text-default-500",children:"Manage your password and account security"})]})]})}),e.jsx(s.Divider,{}),e.jsx(s.CardBody,{children:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium",children:"Password"}),e.jsxs("p",{className:"text-xs text-default-500",children:["Last changed:"," ",m.passwordUpdatedAt?new Date(m.passwordUpdatedAt).toLocaleDateString():"Unknown"]})]}),e.jsx(s.Button,{variant:"bordered",size:"sm",onPress:j.onOpen,isDisabled:n,children:"Change Password"})]})})]}),l&&!x.includes("sessions")&&e.jsxs(s.Card,{variant:u,children:[e.jsx(s.CardHeader,{children:e.jsxs("div",{className:"flex items-center justify-between w-full",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"flex items-center justify-center w-10 h-10 bg-warning/10 rounded-lg",children:e.jsx("svg",{className:"w-5 h-5 text-warning",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"})})}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-md font-semibold",children:"Active Sessions"}),e.jsx("p",{className:"text-sm text-default-500",children:"Manage devices that are signed into your account"})]})]}),P&&e.jsx(s.Button,{variant:"light",color:"danger",size:"sm",onPress:L,isDisabled:n,children:"Sign out all others"})]})}),e.jsx(s.Divider,{}),e.jsx(s.CardBody,{children:e.jsx("div",{className:"space-y-3",children:g.map((r,d)=>{const N=d===0;return e.jsxs("div",{className:"flex items-center justify-between p-3 border border-default-200 rounded-lg",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[H(r.deviceInfo),e.jsxs("div",{className:"flex flex-col",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm font-medium",children:r.deviceInfo?.browser||"Unknown Browser"}),N&&e.jsx(s.Chip,{size:"sm",color:"success",variant:"flat",children:"Current"})]}),e.jsxs("div",{className:"flex items-center gap-2 text-xs text-default-500",children:[e.jsx("span",{children:r.deviceInfo?.os||"Unknown OS"}),e.jsx("span",{children:"•"}),e.jsx("span",{children:r.deviceInfo?.location||"Unknown Location"}),e.jsx("span",{children:"•"}),e.jsxs("span",{children:["Active ",D(r.lastActiveAt)]})]})]})]}),!N&&e.jsx(s.Button,{variant:"light",color:"danger",size:"sm",onPress:()=>M(r.id),isDisabled:n,children:"Sign out"})]},r.id)})})})]}),h&&!x.includes("preferences")&&e.jsxs(s.Card,{variant:u,children:[e.jsx(s.CardHeader,{children:e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"flex items-center justify-center w-10 h-10 bg-secondary/10 rounded-lg",children:e.jsx("svg",{className:"w-5 h-5 text-secondary",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"})})}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-md font-semibold",children:"Security Preferences"}),e.jsx("p",{className:"text-sm text-default-500",children:"Configure your security and privacy settings"})]})]})}),e.jsx(s.Divider,{}),e.jsx(s.CardBody,{children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium",children:"Email notifications for sign-ins"}),e.jsx("p",{className:"text-xs text-default-500",children:"Get notified when someone signs into your account"})]}),e.jsx(s.Switch,{defaultSelected:!0,size:"sm",isDisabled:n})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium",children:"Two-factor authentication"}),e.jsx("p",{className:"text-xs text-default-500",children:"Add an extra layer of security to your account"})]}),e.jsx(s.Switch,{isSelected:m.mfaEnabled,size:"sm",isDisabled:n})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium",children:"Session timeout"}),e.jsx("p",{className:"text-xs text-default-500",children:"Automatically sign out after inactivity"})]}),e.jsx(s.Switch,{defaultSelected:!0,size:"sm",isDisabled:n})]})]})})]}),v.map(r=>!x.includes(r.key)&&e.jsxs(s.Card,{variant:u,children:[e.jsx(s.CardHeader,{children:e.jsxs("div",{className:"flex items-center gap-3",children:[r.icon&&e.jsx("div",{className:"flex items-center justify-center w-10 h-10 bg-default/10 rounded-lg",children:r.icon}),e.jsxs("div",{children:[e.jsx("h4",{className:"text-md font-semibold",children:r.title}),r.description&&e.jsx("p",{className:"text-sm text-default-500",children:r.description})]})]})}),e.jsx(s.Divider,{}),e.jsx(s.CardBody,{children:r.content})]},r.key)),e.jsx(s.Modal,{isOpen:j.isOpen,onOpenChange:j.onOpenChange,placement:"center",size:"md",children:e.jsx(s.ModalContent,{children:r=>e.jsxs(e.Fragment,{children:[e.jsx(s.ModalHeader,{children:e.jsx("h3",{className:"text-lg font-semibold",children:"Change Password"})}),e.jsx(s.ModalBody,{children:e.jsx(E,{onSuccess:d=>{t?.(d),r()},onError:d=>o?.(d),onClose:r,isOpen:j.isOpen})})]})})})]}):null}exports.SecurityPanel=U;
//# sourceMappingURL=security-panel.cjs.map