bustikiller/wedding-planner-frontend
1
0
Fork 0
Code Issues 1 Pull Requests 8 Actions Packages Projects Releases Wiki Activity

Define a button to load the default affinities of a group
All checks were successful
Playwright Tests / test (pull_request) Has been skipped
Details
Add copyright notice / copyright_notice (pull_request) Successful in 2m0s
Details
Check usage of free licenses / build-static-assets (pull_request) Successful in 3m18s
Details
Build Nginx-based docker image / build-static-assets (push) Successful in 7m19s
Details

Browse Source
This commit is contained in:
Manuel Bustillo 2025-01-12 20:54:41 +01:00
parent be4f9caec7
commit c233cb60de
2 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
app/ui/components/affinities-form-dialog.tsx
View File

@ -48,6 +48,16 @@ export default function AffinitiesFormDialog({ groups, group, visible, onHide }:
}); });
} }
function resetAffinities() {
fetch(`/api/${getSlug()}/groups/${group?.id}/affinities/default`, {
method: 'GET',
headers: {
'Accept': 'application/json',
}
}).then((response) => response.json())
.then(setAffinities);
}
return ( return (
<Dialog header="Update affinities" visible={visible} style={{ width: '60vw' }} onHide={onHide}> <Dialog header="Update affinities" visible={visible} style={{ width: '60vw' }} onHide={onHide}>
{!isLoadingAffinities && <div className="card justify-evenly py-5 bg-gray-200 flex flex-col"> {!isLoadingAffinities && <div className="card justify-evenly py-5 bg-gray-200 flex flex-col">
@ -61,8 +71,11 @@ export default function AffinitiesFormDialog({ groups, group, visible, onHide }:
</div>) </div>)
} }
<div className="flex justify-center">
<button className={classNames('gray')} onClick={resetAffinities} >Reset</button>
<button className={classNames('primary')} onClick={submitAffinities} >Update</button> <button className={classNames('primary')} onClick={submitAffinities} >Update</button>
</div> </div>
</div>
} }
</Dialog> </Dialog>
); );

5
app/ui/components/button.tsx
View File

@ -2,13 +2,14 @@
import clsx from "clsx"; import clsx from "clsx";
type ButtonColor = 'primary' | 'blue' | 'green' | 'red' | 'yellow'; type ButtonColor = 'primary' | 'blue' | 'green' | 'red' | 'yellow' | 'gray';
export function classNames(type: ButtonColor) { export function classNames(type: ButtonColor) {
return (clsx("text-white py-1 px-2 mx-1 rounded disabled:opacity-50 disabled:cursor-not-allowed", { return (clsx("text-white py-1 px-2 mx-1 rounded disabled:opacity-50 disabled:cursor-not-allowed", {
'bg-blue-400 hover:bg-blue-600': type === 'primary' || type === 'blue', 'bg-blue-400 hover:bg-blue-600': type === 'primary' || type === 'blue',
'bg-green-500 hover:bg-green-600': type === 'green', 'bg-green-500 hover:bg-green-600': type === 'green',
'bg-red-500 hover:bg-red-600': type === 'red', 'bg-red-500 hover:bg-red-600': type === 'red',
'bg-yellow-500 hover:bg-yellow-700': type === 'yellow' 'bg-yellow-500 hover:bg-yellow-700': type === 'yellow',
'bg-gray-500 hover:bg-gray-700': type === 'gray'
})) }))
} }