diff --git a/template/app/src/admin/dashboards/users/UsersTable.tsx b/template/app/src/admin/dashboards/users/UsersTable.tsx
index f94b145..c16ee1c 100644
--- a/template/app/src/admin/dashboards/users/UsersTable.tsx
+++ b/template/app/src/admin/dashboards/users/UsersTable.tsx
@@ -8,7 +8,9 @@ import { updateIsUserAdminById } from 'wasp/client/operations';
 import { type User } from 'wasp/entities';
 
 const AdminSwitch = ({ id, isAdmin }: Pick<User, 'id' | 'isAdmin'>) => {
-  return <SwitcherOne isOn={isAdmin} onChange={() => updateIsUserAdminById({ id: id, isAdmin: !isAdmin })} />;
+  return (
+    <SwitcherOne isOn={isAdmin} onChange={(value) => updateIsUserAdminById({ id: id, isAdmin: value })} />
+  );
 };
 
 const UsersTable = () => {
diff --git a/template/app/src/admin/elements/forms/FormElementsPage.tsx b/template/app/src/admin/elements/forms/FormElementsPage.tsx
index 3debb5d..7eacad2 100644
--- a/template/app/src/admin/elements/forms/FormElementsPage.tsx
+++ b/template/app/src/admin/elements/forms/FormElementsPage.tsx
@@ -309,8 +309,8 @@ function SwitchExamples() {
   const [isSecondOn, setIsSecondOn] = useState<boolean>(false);
   return (
     <div className='flex flex-col gap-5.5 p-6.5'>
-      <SwitcherOne isOn={isFirstOn} onChange={() => setIsFirstOn(!isFirstOn)} />
-      <SwitcherTwo isOn={isSecondOn} onChange={() => setIsSecondOn(!isSecondOn)} />
+      <SwitcherOne isOn={isFirstOn} onChange={setIsFirstOn} />
+      <SwitcherTwo isOn={isSecondOn} onChange={setIsSecondOn} />
     </div>
   );
 }
diff --git a/template/app/src/admin/elements/forms/SwitcherOne.tsx b/template/app/src/admin/elements/forms/SwitcherOne.tsx
index fabf701..7aef7e1 100644
--- a/template/app/src/admin/elements/forms/SwitcherOne.tsx
+++ b/template/app/src/admin/elements/forms/SwitcherOne.tsx
@@ -1,18 +1,11 @@
 import { cn } from '../../../client/cn';
-import { ChangeEventHandler } from 'react';
 
-const SwitcherOne = ({
-  isOn,
-  onChange,
-}: {
-  isOn: boolean;
-  onChange: ChangeEventHandler<HTMLInputElement>;
-}) => {
+const SwitcherOne = ({ isOn, onChange }: { isOn: boolean; onChange: (value: boolean) => void }) => {
   return (
     <div className='relative'>
       <label className='flex cursor-pointer select-none items-center'>
         <div className='relative'>
-          <input type='checkbox' className='sr-only' onChange={onChange} />
+          <input type='checkbox' className='sr-only' onChange={(e) => onChange(e.target.checked)} />
           <div className='reblock h-8 w-14 rounded-full bg-meta-9 dark:bg-[#5A616B]'></div>
           <div
             className={cn('absolute left-1 top-1 h-6 w-6 rounded-full bg-white dark:bg-gray-400 transition', {
diff --git a/template/app/src/admin/elements/forms/SwitcherTwo.tsx b/template/app/src/admin/elements/forms/SwitcherTwo.tsx
index da9c675..bbf628f 100644
--- a/template/app/src/admin/elements/forms/SwitcherTwo.tsx
+++ b/template/app/src/admin/elements/forms/SwitcherTwo.tsx
@@ -1,18 +1,16 @@
-import { ChangeEventHandler } from 'react';
 import { cn } from '../../../client/cn';
 
-const SwitcherTwo = ({
-  isOn,
-  onChange,
-}: {
-  isOn: boolean;
-  onChange: ChangeEventHandler<HTMLInputElement>;
-}) => {
+const SwitcherTwo = ({ isOn, onChange }: { isOn: boolean; onChange: (value: boolean) => void }) => {
   return (
     <div>
       <label className='flex cursor-pointer select-none items-center'>
         <div className='relative'>
-          <input type='checkbox' id='toggle3' className='sr-only' onChange={onChange} />
+          <input
+            type='checkbox'
+            id='toggle3'
+            className='sr-only'
+            onChange={(e) => onChange(e.target.checked)}
+          />
           <div className='block h-8 w-14 rounded-full bg-meta-9 dark:bg-[#5A616B]'></div>
           <div
             className={cn(