mirror of
https://github.com/jeffvli/feishin.git
synced 2026-05-15 04:51:06 +02:00
Refactor add to playlist modal (#1236)
* Refactor add to playlist modal * redesign base modal component, add ModalButton component * improve visibility of filled button focus --------- Co-authored-by: jeffvli <jeffvictorli@gmail.com>
This commit is contained in:
@@ -11,9 +11,9 @@ import JellyfinIcon from '/@/renderer/features/servers/assets/jellyfin.png';
|
||||
import NavidromeIcon from '/@/renderer/features/servers/assets/navidrome.png';
|
||||
import SubsonicIcon from '/@/renderer/features/servers/assets/opensubsonic.png';
|
||||
import { useAuthStoreActions } from '/@/renderer/store';
|
||||
import { Button } from '/@/shared/components/button/button';
|
||||
import { Checkbox } from '/@/shared/components/checkbox/checkbox';
|
||||
import { Group } from '/@/shared/components/group/group';
|
||||
import { ModalButton } from '/@/shared/components/modal/model-shared';
|
||||
import { Paper } from '/@/shared/components/paper/paper';
|
||||
import { PasswordInput } from '/@/shared/components/password-input/password-input';
|
||||
import { SegmentedControl } from '/@/shared/components/segmented-control/segmented-control';
|
||||
@@ -298,20 +298,18 @@ export const AddServerForm = ({ onCancel }: AddServerFormProps) => {
|
||||
})}
|
||||
/>
|
||||
)}
|
||||
<Group grow justify="flex-end">
|
||||
<Group justify="flex-end">
|
||||
{onCancel && (
|
||||
<Button onClick={onCancel} variant="subtle">
|
||||
{t('common.cancel', { postProcess: 'titleCase' })}
|
||||
</Button>
|
||||
<ModalButton onClick={onCancel}>{t('common.cancel')}</ModalButton>
|
||||
)}
|
||||
<Button
|
||||
<ModalButton
|
||||
disabled={isSubmitDisabled}
|
||||
loading={isLoading}
|
||||
type="submit"
|
||||
variant="filled"
|
||||
>
|
||||
{t('common.add', { postProcess: 'titleCase' })}
|
||||
</Button>
|
||||
{t('common.add')}
|
||||
</ModalButton>
|
||||
</Group>
|
||||
</Stack>
|
||||
</form>
|
||||
|
||||
@@ -9,10 +9,10 @@ import i18n from '/@/i18n/i18n';
|
||||
import { api } from '/@/renderer/api';
|
||||
import { queryClient } from '/@/renderer/lib/react-query';
|
||||
import { useAuthStoreActions } from '/@/renderer/store';
|
||||
import { Button } from '/@/shared/components/button/button';
|
||||
import { Checkbox } from '/@/shared/components/checkbox/checkbox';
|
||||
import { Group } from '/@/shared/components/group/group';
|
||||
import { Icon } from '/@/shared/components/icon/icon';
|
||||
import { ModalButton } from '/@/shared/components/modal/model-shared';
|
||||
import { PasswordInput } from '/@/shared/components/password-input/password-input';
|
||||
import { Stack } from '/@/shared/components/stack/stack';
|
||||
import { TextInput } from '/@/shared/components/text-input/text-input';
|
||||
@@ -216,12 +216,10 @@ export const EditServerForm = ({ isUpdate, onCancel, password, server }: EditSer
|
||||
/>
|
||||
)}
|
||||
<Group justify="flex-end">
|
||||
<Button onClick={onCancel} variant="subtle">
|
||||
{t('common.cancel', { postProcess: 'titleCase' })}
|
||||
</Button>
|
||||
<Button loading={isLoading} type="submit" variant="filled">
|
||||
{t('common.save', { postProcess: 'titleCase' })}
|
||||
</Button>
|
||||
<ModalButton onClick={onCancel}>{t('common.cancel')}</ModalButton>
|
||||
<ModalButton loading={isLoading} type="submit" variant="filled">
|
||||
{t('common.save')}
|
||||
</ModalButton>
|
||||
</Group>
|
||||
</Stack>
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user