mirror/api
1
0
Fork 0
mirror of https://github.com/unraid/api.git synced 2026-01-04 15:39:52 -06:00
Code Issues Packages Projects Releases Wiki Activity

chore: lint

Browse Source
This commit is contained in:
Zack Spear
2023-07-24 14:22:03 -07:00
committed by Zack Spear
parent b18bd3fe5d
commit ffaadfdccf
3 changed files with 92 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
components/Modal.vue
View File

@@ -42,7 +42,15 @@ const ariaLablledById = computed((): string|undefined => props.title ? `ModalTit
<template>
<TransitionRoot appear :show="open" as="template">
<div @keyup.esc="closeModal" ref="trapRef" class="fixed inset-0 z-10 overflow-y-auto" role="dialog" aria-dialog="true" :aria-labelledby="ariaLablledById" tabindex="-1">
<div
ref="trapRef"
class="fixed inset-0 z-10 overflow-y-auto"
role="dialog"
aria-dialog="true"
:aria-labelledby="ariaLablledById"
tabindex="-1"
@keyup.esc="closeModal"
>
<TransitionChild
appear
as="template"
@@ -54,9 +62,9 @@ const ariaLablledById = computed((): string|undefined => props.title ? `ModalTit
leave-to="opacity-0"
>
<div
@click="closeModal"
class="fixed inset-0 z-0 bg-black bg-opacity-80 transition-opacity"
title="Click to close modal"
@click="closeModal"
/>
</TransitionChild>
<div class="text-center flex min-h-full items-center justify-center p-4 md:p-0">
@@ -80,7 +88,7 @@ const ariaLablledById = computed((): string|undefined => props.title ? `ModalTit
class="text-16px text-beta bg-alpha text-left relative flex flex-col justify-around p-16px my-24px sm:p-24px border-2 border-solid shadow-xl transform overflow-hidden rounded-lg transition-all sm:w-full"
>
<div v-if="showCloseX" class="absolute z-20 right-0 top-0 hidden pt-2 pr-2 sm:block">
<button @click="closeModal" type="button" class="rounded-md text-beta bg-alpha p-2 hover:text-white focus:text-white hover:bg-unraid-red focus:bg-unraid-red focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2">
<button type="button" class="rounded-md text-beta bg-alpha p-2 hover:text-white focus:text-white hover:bg-unraid-red focus:bg-unraid-red focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" @click="closeModal">
<span class="sr-only">Close</span>
<XMarkIcon class="h-6 w-6" aria-hidden="true" />
</button>
@@ -90,18 +98,20 @@ const ariaLablledById = computed((): string|undefined => props.title ? `ModalTit
<template v-if="!$slots['header']">
<h1 v-if="title" :id="ariaLablledById" class="text-24px font-semibold flex flex-wrap justify-center gap-x-1">
{{ title }}
<slot name="headerTitle"></slot>
<slot name="headerTitle" />
</h1>
<h2 v-if="description" class="text-20px opacity-75">{{ description }}</h2>
<h2 v-if="description" class="text-20px opacity-75">
{{ description }}
</h2>
</template>
<slot name="header"></slot>
<slot name="header" />
</header>
<slot name="main"></slot>
<slot name="main" />
<footer v-if="$slots['footer']" class="text-14px relative -mx-16px -mb-16px sm:-mx-24px sm:-mb-24px p-4 sm:p-6">
<div class="absolute z-0 inset-0 opacity-10 bg-beta"></div>
<div class="absolute z-0 inset-0 opacity-10 bg-beta" />
<div class="relative z-10">
<slot name="footer"></slot>
<slot name="footer" />
</div>
</footer>
</div>

63
components/UserProfile/CallbackFeedback.vue
View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { useClipboard } from '@vueuse/core'
import { useClipboard } from '@vueuse/core';
import { ClipboardIcon, CogIcon, InformationCircleIcon } from '@heroicons/vue/24/solid';
import { storeToRefs } from 'pinia';
import 'tailwindcss/tailwind.css';
@@ -53,7 +53,7 @@ const {
* If we're on the Connect settings page in the webGUI
* the modal should close instead of redirecting to the
* settings page.
*
*
* @todo figure out the difference between document.location and window.location
*/
const isSettingsPage = ref<boolean>(document.location.pathname === '/Settings/ManagementAccess');
@@ -75,25 +75,25 @@ const subheading = computed(() => {
if (callbackStatus.value === 'error') {
return 'Something went wrong'; /** @todo show actual error messages */
}
if (callbackStatus.value === 'loading') return 'Please keep this window open while we perform some actions';
if (callbackStatus.value === 'loading') { return 'Please keep this window open while we perform some actions'; }
if (callbackStatus.value === 'success') {
if (accountActionType.value === 'signIn') return `You're one step closer to enhancing your Unraid experience`;
if (keyActionType.value === 'purchase') return `Thank you for purchasing an Unraid ${keyType.value} Key!`;
if (keyActionType.value === 'replace') return `Your ${keyType.value} Key has been replaced!`;
if (keyActionType.value === 'trialExtend') return `Your Trial key has been extended!`;
if (keyActionType.value === 'trialStart') return `Your free Trial key provides all the functionality of a Pro Registration key`;
if (keyActionType.value === 'upgrade') return `Thank you for upgrading to an Unraid ${keyType.value} Key!`;
if (accountActionType.value === 'signIn') { return 'You\'re one step closer to enhancing your Unraid experience'; }
if (keyActionType.value === 'purchase') { return `Thank you for purchasing an Unraid ${keyType.value} Key!`; }
if (keyActionType.value === 'replace') { return `Your ${keyType.value} Key has been replaced!`; }
if (keyActionType.value === 'trialExtend') { return 'Your Trial key has been extended!'; }
if (keyActionType.value === 'trialStart') { return 'Your free Trial key provides all the functionality of a Pro Registration key'; }
if (keyActionType.value === 'upgrade') { return `Thank you for upgrading to an Unraid ${keyType.value} Key!`; }
return '';
}
return '';
});
const closeText = computed(() => {
const txt = !connectPluginInstalled.value ? 'No Thanks' : 'Close'
const txt = !connectPluginInstalled.value ? 'No Thanks' : 'Close';
return refreshedServerState.value ? txt : 'Reload';
});
const close = () => {
if (callbackStatus.value === 'loading') return console.debug('[close] not allowed');
if (callbackStatus.value === 'loading') { return console.debug('[close] not allowed'); }
return refreshedServerState.value
? callbackActionsStore.setCallbackStatus('ready')
: window.location.reload();
@@ -115,8 +115,8 @@ const { text, copy, copied, isSupported } = useClipboard({ source: keyUrl.value
max-width="max-w-640px"
:error="callbackStatus === 'error'"
:success="callbackStatus === 'success'"
@close="close"
:show-close-x="callbackStatus !== 'loading'"
@close="close"
>
<template #main>
<div
@@ -136,11 +136,14 @@ const { text, copy, copied, isSupported } = useClipboard({ source: keyUrl.value
<template v-if="keyInstallStatus === 'failed'">
<div v-if="isSupported" class="flex justify-center">
<BrandButton
@click="copy(keyUrl)"
:icon="ClipboardIcon"
:text="copied ? 'Copied' : 'Copy Key URL'" />
:text="copied ? 'Copied' : 'Copy Key URL'"
@click="copy(keyUrl)"
/>
</div>
<p v-else>{{ 'Copy your Key URL' }}: {{ keyUrl }}</p>
<p v-else>
{{ 'Copy your Key URL' }}: {{ keyUrl }}
</p>
<p><a href="/Tools/Registration" class="opacity-75 hover:opacity-100 focus:opacity-100 underline transition">{{ 'Then go to Tools > Registration to manually install it' }}</a></p>
</template>
</UpcCallbackFeedbackStatus>
@@ -149,17 +152,20 @@ const { text, copy, copied, isSupported } = useClipboard({ source: keyUrl.value
v-if="accountActionStatus !== 'ready' && !accountActionHide"
:success="accountActionStatus === 'success'"
:error="accountActionStatus === 'failed'"
:text="accountActionStatusCopy.text" />
:text="accountActionStatusCopy.text"
/>
<UpcCallbackFeedbackStatus
v-if="showPromoCta"
:icon="InformationCircleIcon"
:text="'Enhance your experience with Unraid Connect'" />
:text="'Enhance your experience with Unraid Connect'"
/>
<UpcCallbackFeedbackStatus
v-if="showSignInCta"
:icon="InformationCircleIcon"
:text="'Sign In to utilize Unraid Connect'" />
:text="'Sign In to utilize Unraid Connect'"
/>
</div>
</template>
@@ -168,34 +174,39 @@ const { text, copy, copied, isSupported } = useClipboard({ source: keyUrl.value
<template v-if="connectPluginInstalled && accountActionType === 'signIn'">
<BrandButton
v-if="isSettingsPage"
@click="close"
:icon="CogIcon"
:text="'Configure Connect Features'"
class="grow-0" />
class="grow-0"
@click="close"
/>
<BrandButton
v-else
:href="PLUGIN_SETTINGS"
:icon="CogIcon"
:text="'Configure Connect Features'"
class="grow-0" />
class="grow-0"
/>
</template>
<BrandButton
v-if="showPromoCta"
:text="'Learn More'"
@click="promoClick"
:text="'Learn More'" />
/>
<BrandButton
v-if="showSignInCta"
@click="authAction?.click"
:external="authAction?.external"
:icon="authAction?.icon"
:text="authAction?.text" />
:text="authAction?.text"
@click="authAction?.click"
/>
<BrandButton
@click="close"
btn-style="underline"
:text="closeText" />
:text="closeText"
@click="close"
/>
</div>
</template>
</Modal>

72
components/UserProfile/DropdownContent.vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { ArrowTopRightOnSquareIcon, CogIcon, InformationCircleIcon, } from '@heroicons/vue/24/solid';
import { ArrowTopRightOnSquareIcon, CogIcon, InformationCircleIcon } from '@heroicons/vue/24/solid';
import { ACCOUNT, CONNECT_DASHBOARD, PLUGIN_SETTINGS } from '~/helpers/urls';
import { useErrorsStore } from '~/store/errors';
@@ -24,56 +24,56 @@ const links = computed(():UserProfileLink[] => {
return [
...(registered.value && connectPluginInstalled.value
? [
{
emphasize: true,
external: true,
href: CONNECT_DASHBOARD,
icon: ArrowTopRightOnSquareIcon,
text: 'Go to Connect',
title: 'Opens Connect in new tab',
},
{
external: true,
href: ACCOUNT,
icon: ArrowTopRightOnSquareIcon,
text: 'Manage Unraid.net Account',
title: 'Manage Unraid.net Account in new tab',
},
{
href: PLUGIN_SETTINGS,
icon: CogIcon,
text: 'Settings',
title: 'Go to Connect plugin settings',
},
...(signOutAction.value),
]
{
emphasize: true,
external: true,
href: CONNECT_DASHBOARD,
icon: ArrowTopRightOnSquareIcon,
text: 'Go to Connect',
title: 'Opens Connect in new tab',
},
{
external: true,
href: ACCOUNT,
icon: ArrowTopRightOnSquareIcon,
text: 'Manage Unraid.net Account',
title: 'Manage Unraid.net Account in new tab',
},
{
href: PLUGIN_SETTINGS,
icon: CogIcon,
text: 'Settings',
title: 'Go to Connect plugin settings',
},
...(signOutAction.value),
]
: []
),
...(!registered.value && connectPluginInstalled.value
? [
...(signInAction.value),
]
...(signInAction.value),
]
: []
),
...(!connectPluginInstalled.value
? [
{
click: () => {
promoStore.promoShow();
{
click: () => {
promoStore.promoShow();
},
icon: InformationCircleIcon,
text: 'Enhance your Unraid experience with Connect',
title: 'Enhance your Unraid experience with Connect',
},
icon: InformationCircleIcon,
text: 'Enhance your Unraid experience with Connect',
title: 'Enhance your Unraid experience with Connect',
},
]
]
: []
),
];
});
const showErrors = computed(() => errors.value.length);
const showConnectStatus = computed(() => !stateData.value.error && registered.value && connectPluginInstalled.value);
const showKeyline = computed(() => (showErrors.value || showConnectStatus.value) && keyActions.value?.length && links.value.length);
const showConnectStatus = computed(() => !showErrors.value && !stateData.value.error && registered.value && connectPluginInstalled.value);
</script>
<template>
@@ -89,8 +89,8 @@ const showKeyline = computed(() => (showErrors.value || showConnectStatus.value)
</span>
</header>
<ul class="list-reset flex flex-col gap-y-4px p-0">
<UpcDropdownError v-if="showErrors" />
<UpcDropdownConnectStatus v-if="showConnectStatus" class="mt-8px" />
<UpcDropdownError v-if="showErrors" />
<li v-if="showKeyline" class="my-8px">
<UpcKeyline />