first commit

frontend/src/components/auth/QuickActions.tsx

@@ -0,0 +1,52 @@
+import { KeyRound, UserPlus } from 'lucide-react'
+
+interface QuickActionsProps {
+  onResetPassword: () => void
+  onCreateAccount: () => void
+}
+
+export default function QuickActions({
+  onResetPassword,
+  onCreateAccount,
+}: QuickActionsProps) {
+  return (
+    <div className="space-y-6">
+      <div>
+        <h3 className="text-sm font-semibold text-silos-text">Quick Actions</h3>
+        <div className="mt-3 space-y-2">
+          <button
+            type="button"
+            onClick={onResetPassword}
+            className="flex w-full items-start gap-3 rounded-xl border border-silos-cream-dark bg-silos-cream/30 p-4 text-left transition-colors hover:border-silos-tan hover:bg-silos-cream/60"
+          >
+            <div className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-silos-brown/10">
+              <KeyRound className="h-4 w-4 text-silos-brown" />
+            </div>
+            <div>
+              <p className="text-sm font-semibold text-silos-text">Reset Password</p>
+              <p className="mt-0.5 text-xs text-silos-muted">
+                Reset your account password securely
+              </p>
+            </div>
+          </button>
+
+          <button
+            type="button"
+            onClick={onCreateAccount}
+            className="flex w-full items-start gap-3 rounded-xl border border-silos-cream-dark bg-silos-cream/30 p-4 text-left transition-colors hover:border-silos-tan hover:bg-silos-cream/60"
+          >
+            <div className="flex h-9 w-9 shrink-0 items-center justify-center rounded-lg bg-silos-brown/10">
+              <UserPlus className="h-4 w-4 text-silos-brown" />
+            </div>
+            <div>
+              <p className="text-sm font-semibold text-silos-text">Create New Account</p>
+              <p className="mt-0.5 text-xs text-silos-muted">
+                Join Silos and start your journey today
+              </p>
+            </div>
+          </button>
+        </div>
+      </div>
+    </div>
+  )
+}