[ENG-1064] replace alert dialogs with toasts (#1290)

* replace alert dialogs with toasts

* revert job error to alertDialog
This commit is contained in:
nikec
2023-09-02 23:31:53 +02:00
committed by GitHub
parent e9acb3881c
commit 6fa8a124c8
16 changed files with 61 additions and 108 deletions

View File

@@ -1,7 +1,6 @@
import { Copy, Scissors } from 'phosphor-react';
import { useLibraryMutation } from '@sd/client';
import { ContextMenu, ModifierKeys } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { ContextMenu, ModifierKeys, toast } from '@sd/ui';
import { useKeybindFactory } from '~/hooks/useKeybindFactory';
import { isNonEmpty } from '~/util';
import { useExplorerContext } from '../../Context';
@@ -68,9 +67,9 @@ export const CutCopyItems = new ConditionalItem({
target_file_name_suffix: ' copy'
});
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to duplcate file, due to an error: ${error}`
toast.error({
title: 'Failed to duplicate file',
body: `Error: ${error}.`
});
}
}}

View File

@@ -1,7 +1,6 @@
import { Image, Package, Trash, TrashSimple } from 'phosphor-react';
import { libraryClient, useLibraryContext, useLibraryMutation } from '@sd/client';
import { ContextMenu, ModifierKeys, dialogManager } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { ContextMenu, ModifierKeys, dialogManager, toast } from '@sd/ui';
import { useKeybindFactory } from '~/hooks/useKeybindFactory';
import { isNonEmpty } from '~/util';
import { usePlatform } from '~/util/Platform';
@@ -195,9 +194,9 @@ export const ParentFolderActions = new ConditionalItem({
reidentify_objects: false
});
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to rescan location, due to an error: ${error}`
toast.error({
title: `Failed to rescan location`,
body: `Error: ${error}.`
});
}
}}
@@ -212,9 +211,9 @@ export const ParentFolderActions = new ConditionalItem({
path: selectedFilePaths[0]?.materialized_path ?? '/'
});
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to generate thumbnails, due to an error: ${error}`
toast.error({
title: `Failed to generate thumbnails`,
body: `Error: ${error}.`
});
}
}}
@@ -264,9 +263,9 @@ export const OpenOrDownload = new ConditionalItem({
selectedFilePaths.map((p) => p.id)
);
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to open file, due to an error: ${error}`
toast.error({
title: `Failed to open file`,
body: `Error: ${error}.`
});
}
}}

View File

@@ -1,8 +1,7 @@
import { useQuery } from '@tanstack/react-query';
import { Suspense } from 'react';
import { useLibraryContext } from '@sd/client';
import { ContextMenu } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { ContextMenu, toast } from '@sd/ui';
import { Platform, usePlatform } from '~/util/Platform';
import { ConditionalItem } from '../ConditionalItem';
import { useContextMenuContext } from '../context';
@@ -61,11 +60,7 @@ const Items = ({
ids.map((id) => [id, data.url])
);
} catch (e) {
console.error(e);
showAlertDialog({
title: 'Error',
value: `Failed to open file, with: ${data.url}`
});
toast.error(`Failed to open file, with: ${data.url}`);
}
}}
>

View File

@@ -1,8 +1,7 @@
import { ArrowBendUpRight, TagSimple } from 'phosphor-react';
import { useMemo } from 'react';
import { ObjectKind, type ObjectKindEnum, useLibraryMutation } from '@sd/client';
import { ContextMenu } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { ContextMenu, toast } from '@sd/ui';
import AssignTagMenuItems from '~/components/AssignTagMenuItems';
import { isNonEmpty } from '~/util';
import { ConditionalItem } from '../ConditionalItem';
@@ -29,9 +28,9 @@ export const RemoveFromRecents = new ConditionalItem({
selectedObjects.map((object) => object.id)
);
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to remove file from recents, due to an error: ${error}`
toast.error({
title: `Failed to remove file from recents`,
body: `Error: ${error}.`
});
}
}}

View File

@@ -1,6 +1,5 @@
import { ClipboardText } from 'phosphor-react';
import { ContextMenu } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { ContextMenu, toast } from '@sd/ui';
export const CopyAsPathBase = (
props: { path: string } | { getPath: () => Promise<string | null> }
@@ -22,9 +21,9 @@ export const CopyAsPathBase = (
navigator.clipboard.writeText(path);
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to copy file path: ${error}`
toast.error({
title: `Failed to copy file path`,
body: `Error: ${error}.`
});
}
}}

View File

@@ -10,8 +10,7 @@ import {
} from 'react';
import { useKey } from 'rooks';
import { useLibraryMutation, useRspcLibraryContext } from '@sd/client';
import { Tooltip } from '~/../packages/ui/src';
import { showAlertDialog } from '~/components';
import { Tooltip, toast } from '@sd/ui';
import { useIsTextTruncated, useOperatingSystem } from '~/hooks';
import { useExplorerViewContext } from '../ViewContext';
@@ -245,9 +244,9 @@ export const RenamePathTextBox = ({
});
} catch (e) {
reset();
showAlertDialog({
title: 'Error',
value: `Could not rename ${fileName} to ${newName}, due to an error: ${e}`
toast.error({
title: `Could not rename ${fileName} to ${newName}`,
body: `Error: ${e}.`
});
}
}
@@ -288,10 +287,7 @@ export const RenameLocationTextBox = (props: Omit<Props, 'renameHandler'>) => {
});
} catch (e) {
reset();
showAlertDialog({
title: 'Error',
value: String(e)
});
toast.error({ title: 'Failed to rename', body: `Error: ${e}.` });
}
}

View File

@@ -1,8 +1,7 @@
import { Clipboard, FileX, Image, Plus, Repeat, Share, ShieldCheck } from 'phosphor-react';
import { PropsWithChildren } from 'react';
import { useLibraryMutation } from '@sd/client';
import { ContextMenu as CM, ModifierKeys } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { ContextMenu as CM, ModifierKeys, toast } from '@sd/ui';
import { useOperatingSystem } from '~/hooks';
import { keybindForOs } from '~/util/keybinds';
import { useExplorerContext } from './Context';
@@ -51,10 +50,7 @@ export default (props: PropsWithChildren) => {
target_file_name_suffix: sameLocation ? ' copy' : null
});
} else if (sameLocation) {
showAlertDialog({
title: 'Error',
value: `File already exists in this location`
});
toast.error('File already exists in this location');
} else {
await cutFiles.mutateAsync({
source_location_id: sourceLocationId,
@@ -64,9 +60,9 @@ export default (props: PropsWithChildren) => {
});
}
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to ${type.toLowerCase()} file, due to an error: ${error}`
toast.error({
title: `Failed to ${type.toLowerCase()} file`,
body: `Error: ${error}.`
});
}
}}
@@ -118,9 +114,9 @@ export default (props: PropsWithChildren) => {
sub_path: currentPath ?? ''
});
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to re-index location, due to an error: ${error}`
toast.error({
title: `Failed to re-index location`,
body: `Error: ${error}.`
});
}
}}
@@ -136,9 +132,9 @@ export default (props: PropsWithChildren) => {
path: currentPath ?? '/'
});
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to generate thumbanails, due to an error: ${error}`
toast.error({
title: `Failed to generate thumbnails`,
body: `Error: ${error}.`
});
}
}}
@@ -154,9 +150,9 @@ export default (props: PropsWithChildren) => {
path: currentPath ?? '/'
});
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to generate checksum, due to an error: ${error}`
toast.error({
title: `Failed to generate checksum`,
body: `Error: ${error}.`
});
}
}}

View File

@@ -24,8 +24,7 @@ import {
useLibraryContext,
useLibraryMutation
} from '@sd/client';
import { ContextMenu, ModifierKeys, dialogManager } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { ContextMenu, ModifierKeys, dialogManager, toast } from '@sd/ui';
import { useOperatingSystem } from '~/hooks';
import { isNonEmpty } from '~/util';
import { usePlatform } from '~/util/Platform';
@@ -114,10 +113,7 @@ export const ViewItem = ({ data, children, ...props }: ViewItemProps) => {
selectedItems.paths.map(({ id }) => id)
);
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Failed to open file, due to an error: ${error}`
});
toast.error({ title: 'Failed to open file', body: `Error: ${error}.` });
}
} else if (!explorerConfig.openOnDoubleClick) {
if (data.type !== 'Location' && !(isPath(data) && data.item.is_dir)) {
@@ -343,10 +339,7 @@ const useKeyDownHandlers = ({ isRenaming }: { isRenaming: boolean }) => {
try {
await openFilePaths(library.uuid, paths);
} catch (error) {
showAlertDialog({
title: 'Error',
value: `Couldn't open file, due to an error: ${error}`
});
toast.error({ title: 'Failed to open file', body: `Error: ${error}.` });
}
},
[os, library.uuid, openFilePaths, explorer.selectedItems]

View File

@@ -1,8 +1,7 @@
import clsx from 'clsx';
import { useState } from 'react';
import { useZodForm } from '@sd/client';
import { Dialog, TextArea, UseDialogProps, useDialog, z } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { Dialog, TextArea, UseDialogProps, toast, useDialog, z } from '@sd/ui';
const schema = z.object({
feedback: z.string().min(1),
@@ -33,10 +32,7 @@ export default function FeedbackDialog(props: UseDialogProps) {
mode: 'no-cors'
});
} catch (error) {
showAlertDialog({
title: 'Error',
value: 'There was an error submitting your feedback. Please try again.'
});
toast.error('There was an error submitting your feedback. Please try again.');
}
});

View File

@@ -1,7 +1,7 @@
import { Copy, Fingerprint, Folder, Icon, Image, Info, Scissors, Trash } from 'phosphor-react';
import { memo } from 'react';
import { JobProgressEvent, JobReport, useJobInfo } from '@sd/client';
import { ProgressBar } from '@sd/ui';
import { ProgressBar, toast } from '@sd/ui';
import { showAlertDialog } from '~/components';
import JobContainer from './JobContainer';

View File

@@ -1,12 +1,11 @@
import { Pencil, Plus, Trash } from 'phosphor-react';
import { useNavigate } from 'react-router';
import { ContextMenu as CM, dialogManager } from '@sd/ui';
import { ContextMenu as CM, dialogManager, toast } from '@sd/ui';
import {
AddLocationDialog,
openDirectoryPickerDialog
} from '~/app/$libraryId/settings/library/locations/AddLocationDialog';
import DeleteDialog from '~/app/$libraryId/settings/library/locations/DeleteDialog';
import { showAlertDialog } from '~/components';
import { usePlatform } from '~/util/Platform';
interface Props {
@@ -29,10 +28,7 @@ export default ({ children, locationId }: Props) => {
));
}
} catch (error) {
showAlertDialog({
title: 'Error',
value: String(error)
});
toast.error(`${error}`);
}
}}
icon={Plus}

View File

@@ -13,12 +13,12 @@ import {
RadioGroupField,
SwitchField,
Tooltip,
toast,
tw,
z
} from '@sd/ui';
import ModalLayout from '~/app/$libraryId/settings/ModalLayout';
import { LocationIdParamsSchema } from '~/app/route-schemas';
import { showAlertDialog } from '~/components';
import { useZodRouteParams } from '~/hooks';
import IndexerRuleEditor from './IndexerRuleEditor';
@@ -86,10 +86,7 @@ const EditLocationForm = () => {
const updateLocation = useLibraryMutation('locations.update', {
onError: () => {
showAlertDialog({
title: 'Error',
value: 'Failed to update location settings'
});
toast.error('Failed to update location settings');
},
onSuccess: () => {
form.reset(form.getValues());

View File

@@ -3,7 +3,6 @@ import { motion } from 'framer-motion';
import { FolderSimplePlus } from 'phosphor-react';
import { useRef, useState } from 'react';
import { Button, type ButtonProps, dialogManager } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { useCallbackToWatchResize } from '~/hooks';
import { usePlatform } from '~/util/Platform';
import { AddLocationDialog, openDirectoryPickerDialog } from './AddLocationDialog';

View File

@@ -11,8 +11,7 @@ import {
usePlausibleEvent,
useZodForm
} from '@sd/client';
import { Dialog, ErrorMessage, InputField, UseDialogProps, useDialog, z } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { Dialog, ErrorMessage, InputField, UseDialogProps, toast, useDialog, z } from '@sd/ui';
import Accordion from '~/components/Accordion';
import { useCallbackToWatchForm } from '~/hooks';
import { Platform, usePlatform } from '~/util/Platform';
@@ -192,10 +191,7 @@ export const AddLocationDialog = ({
throw error;
}
showAlertDialog({
title: 'Error',
value: String(error) || 'Failed to add location'
});
toast.error({ title: 'Failed to add location', body: `Error: ${error}.` });
return;
}
@@ -217,7 +213,7 @@ export const AddLocationDialog = ({
: ''
}
>
<ErrorMessage name={REMOTE_ERROR_FORM_FIELD} variant="large" className="mt-2 mb-4" />
<ErrorMessage name={REMOTE_ERROR_FORM_FIELD} variant="large" className="mb-4 mt-2" />
<InputField
size="md"
@@ -225,7 +221,7 @@ export const AddLocationDialog = ({
onClick={() =>
openDirectoryPickerDialog(platform)
.then((path) => path && form.setValue('path', path))
.catch((error) => showAlertDialog({ title: 'Error', value: String(error) }))
.catch((error) => toast.error(String(error)))
}
readOnly={platform.platform !== 'web'}
className={clsx('mb-3', platform.platform === 'web' || 'cursor-pointer')}

View File

@@ -1,7 +1,6 @@
import clsx from 'clsx';
import { ChangeEvent, ChangeEventHandler, forwardRef, memo } from 'react';
import { Input } from '@sd/ui';
import { showAlertDialog } from '~/components';
import { Input, toast } from '@sd/ui';
import { useOperatingSystem } from '~/hooks';
import { usePlatform } from '~/util/Platform';
import { openDirectoryPickerDialog } from '../AddLocationDialog';
@@ -132,10 +131,7 @@ export const RuleInput = memo(
props.onChange?.(event);
}
} catch (error) {
showAlertDialog({
title: 'Error',
value: String(error)
});
toast.error(String(error));
}
}}
{...props}

View File

@@ -3,7 +3,7 @@ import { Trash } from 'phosphor-react';
import { MouseEventHandler, useState } from 'react';
import { ControllerRenderProps } from 'react-hook-form';
import { IndexerRule, useLibraryMutation, useLibraryQuery } from '@sd/client';
import { Button, Divider, Label } from '@sd/ui';
import { Button, Divider, Label, toast } from '@sd/ui';
import { InfoText } from '@sd/ui/src/forms';
import { showAlertDialog } from '~/components';
import RuleButton from './RuleButton';
@@ -50,10 +50,7 @@ export default function IndexerRuleEditor<T extends IndexerRuleIdFieldType>({
try {
await deleteIndexerRule.mutateAsync(selectedRule.id);
} catch (error) {
showAlertDialog({
title: 'Error',
value: String(error) || 'Failed to delete rule'
});
toast.error({ title: 'Failed to delete rule', body: `Error: ${error}.` });
} finally {
setIsDeleting(false);
setSelectedRule(undefined);