diff --git a/client/components/admin/OnboardingWizard.jsx b/client/components/admin/OnboardingWizard.tsx
similarity index 95%
rename from client/components/admin/OnboardingWizard.jsx
rename to client/components/admin/OnboardingWizard.tsx
index 7944df2..a870e42 100644
--- a/client/components/admin/OnboardingWizard.jsx
+++ b/client/components/admin/OnboardingWizard.tsx
@@ -1,13 +1,14 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
 import { toast } from 'sonner';
 import { api } from '@/api';
+import { errMessage } from '@/lib/utils';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
 
-export default function OnboardingWizard({ onComplete }) {
+export default function OnboardingWizard({ onComplete }: { onComplete: () => void }) {
   const [step, setStep]         = useState(0);
   const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
@@ -15,7 +16,7 @@ export default function OnboardingWizard({ onComplete }) {
   const [loading, setLoading]   = useState(false);
   const [error, setError]       = useState('');
 
-  const handleCreate = async (e) => {
+  const handleCreate = async (e: React.FormEvent) => {
     e.preventDefault();
     setError('');
 
@@ -38,7 +39,7 @@ export default function OnboardingWizard({ onComplete }) {
       toast.success('User created successfully.');
       onComplete();
     } catch (err) {
-      const errorMessage = err.message || 'Failed to create user.';
+      const errorMessage = errMessage(err, 'Failed to create user.');
       setError(errorMessage);
       toast.error(errorMessage);
     } finally {