improve renaming user experience

This commit is contained in:
MarconLP 2023-04-16 01:30:01 +02:00
parent bf202b958c
commit e819ce242e
No known key found for this signature in database
GPG key ID: A08A9C8B623F5EA5

View file

@ -172,6 +172,16 @@ export default function VideoMoreMenu({ video }: Props) {
leaveTo="opacity-0 scale-95" leaveTo="opacity-0 scale-95"
> >
<Dialog.Panel className="w-full max-w-md transform overflow-hidden rounded-2xl bg-white p-6 text-left align-middle shadow-xl transition-all"> <Dialog.Panel className="w-full max-w-md transform overflow-hidden rounded-2xl bg-white p-6 text-left align-middle shadow-xl transition-all">
<form
onSubmit={(e) => {
e.preventDefault();
renameVideoMutation.mutate({
videoId: video.id,
title,
});
setRenameMenuOpen(false);
}}
>
<div className="sm:col-span-4"> <div className="sm:col-span-4">
<label <label
htmlFor="title" htmlFor="title"
@ -194,14 +204,11 @@ export default function VideoMoreMenu({ video }: Props) {
<button <button
type="submit" type="submit"
onClick={() => {
renameVideoMutation.mutate({ videoId: video.id, title });
setRenameMenuOpen(false);
}}
className="mt-2 rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600" className="mt-2 rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
> >
Save Save
</button> </button>
</form>
</Dialog.Panel> </Dialog.Panel>
</Transition.Child> </Transition.Child>
</div> </div>