highperfocused/open-saas
1
0
Fork 0
mirror of https://github.com/wasp-lang/open-saas.git synced 2025-06-30 02:21:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fix abstraction leak in Switchers

Browse Source
This commit is contained in:
Filip Sodić
2025-02-21 15:42:17 +01:00
parent c4c46fc39d
commit 3adfacc5ed
4 changed files with 14 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
template/app/src/admin/dashboards/users/UsersTable.tsx
View File

@ -8,7 +8,9 @@ import { updateIsUserAdminById } from 'wasp/client/operations';
import { type User } from 'wasp/entities'; import { type User } from 'wasp/entities';
const AdminSwitch = ({ id, isAdmin }: Pick<User, 'id' | 'isAdmin'>) => { 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 = () => { const UsersTable = () => {

4
template/app/src/admin/elements/forms/FormElementsPage.tsx
View File

@ -309,8 +309,8 @@ function SwitchExamples() {
const [isSecondOn, setIsSecondOn] = useState<boolean>(false); const [isSecondOn, setIsSecondOn] = useState<boolean>(false);
return ( return (
<div className='flex flex-col gap-5.5 p-6.5'> <div className='flex flex-col gap-5.5 p-6.5'>
<SwitcherOne isOn={isFirstOn} onChange={() => setIsFirstOn(!isFirstOn)} /> <SwitcherOne isOn={isFirstOn} onChange={setIsFirstOn} />
<SwitcherTwo isOn={isSecondOn} onChange={() => setIsSecondOn(!isSecondOn)} /> <SwitcherTwo isOn={isSecondOn} onChange={setIsSecondOn} />
</div> </div>
); );
} }

11
template/app/src/admin/elements/forms/SwitcherOne.tsx
View File

@ -1,18 +1,11 @@
import { cn } from '../../../client/cn'; import { cn } from '../../../client/cn';
import { ChangeEventHandler } from 'react';
const SwitcherOne = ({ const SwitcherOne = ({ isOn, onChange }: { isOn: boolean; onChange: (value: boolean) => void }) => {
isOn,
onChange,
}: {
isOn: boolean;
onChange: ChangeEventHandler<HTMLInputElement>;
}) => {
return ( return (
<div className='relative'> <div className='relative'>
<label className='flex cursor-pointer select-none items-center'> <label className='flex cursor-pointer select-none items-center'>
<div className='relative'> <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='reblock h-8 w-14 rounded-full bg-meta-9 dark:bg-[#5A616B]'></div>
<div <div
className={cn('absolute left-1 top-1 h-6 w-6 rounded-full bg-white dark:bg-gray-400 transition', { className={cn('absolute left-1 top-1 h-6 w-6 rounded-full bg-white dark:bg-gray-400 transition', {

16
template/app/src/admin/elements/forms/SwitcherTwo.tsx
View File

@ -1,18 +1,16 @@
import { ChangeEventHandler } from 'react';
import { cn } from '../../../client/cn'; import { cn } from '../../../client/cn';
const SwitcherTwo = ({ const SwitcherTwo = ({ isOn, onChange }: { isOn: boolean; onChange: (value: boolean) => void }) => {
isOn,
onChange,
}: {
isOn: boolean;
onChange: ChangeEventHandler<HTMLInputElement>;
}) => {
return ( return (
<div> <div>
<label className='flex cursor-pointer select-none items-center'> <label className='flex cursor-pointer select-none items-center'>
<div className='relative'> <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='block h-8 w-14 rounded-full bg-meta-9 dark:bg-[#5A616B]'></div>
<div <div
className={cn( className={cn(