usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'develop' into fix-signout

This commit is contained in:
かっこかり 2025-12-30 16:00:00 +09:00 committed by GitHub
parent 1fa0c176f9 97d485bdd2
commit 2bf40acc79
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
32 changed files with 298 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -6,6 +6,7 @@
### Client
- Enhance: ドライブのファイル一覧で自動でもっと見るを利用可能に
- Enhance: ウィジェットの表示設定をプレビューを見ながら行えるように
- Enhance: ウィジェットの設定項目のラベルの多言語対応
- Enhance: アカウント管理ページで、全てのアカウントから一括でログアウトできるように
- Fix: ドライブクリーナーでファイルを削除しても画面に反映されない問題を修正 #16061
- Fix: ログアウトボタンを押下するとすべてのアカウントからログアウトする問題を修正

37
locales/ja-JP.yml
View File

@ -2605,6 +2605,43 @@ _widgets:
birthdayFollowings: "今日誕生日のユーザー"
chat: "ダイレクトメッセージ"
_widgetOptions:
showHeader: "ヘッダーを表示"
transparent: "背景を透明にする"
height: "高さ"
_button:
colored: "色付き"
_clock:
size: "サイズ"
thickness: "針の太さ"
thicknessThin: "細い"
thicknessMedium: "普通"
thicknessThick: "太い"
graduations: "文字盤の目盛り"
graduationDots: "ドット"
graduationArabic: "アラビア数字"
fadeGraduations: "目盛りをフェード"
sAnimation: "秒針のアニメーション"
sAnimationElastic: "リアル"
sAnimationEaseOut: "滑らか"
twentyFour: "24時間表示"
labelTime: "時刻"
labelTz: "タイムゾーン"
labelTimeAndTz: "時刻とタイムゾーン"
timezone: "タイムゾーン"
showMs: "ミリ秒を表示"
showLabel: "ラベルを表示"
_jobQueue:
sound: "音を鳴らす"
_rss:
url: "RSSフィードのURL"
refreshIntervalSec: "更新間隔(秒)"
maxEntries: "最大表示件数"
_rssTicker:
shuffle: "表示順をシャッフル"
duration: "ティッカーのスクロール速度(秒)"
reverse: "逆方向にスクロール"
_cw:
hide: "隠す"
show: "もっと見る"

6
packages/frontend/src/components/MkForm.vue
View File

@ -7,15 +7,15 @@ SPDX-License-Identifier: AGPL-3.0-only
<div v-if="Object.keys(form).filter(item => !form[item].hidden).length > 0" class="_gaps_m">
<template v-for="v, k in form">
<template v-if="typeof v.hidden == 'function' ? v.hidden(values) : v.hidden"></template>
<MkInput v-else-if="v.type === 'number'" v-model="values[k]" type="number" :step="v.step || 1">
<MkInput v-else-if="v.type === 'number'" v-model="values[k]" type="number" :step="v.step || 1" :manualSave="v.manualSave">
<template #label><span v-text="v.label || k"></span><span v-if="v.required === false"> ({{ i18n.ts.optional }})</span></template>
<template v-if="v.description" #caption>{{ v.description }}</template>
</MkInput>
<MkInput v-else-if="v.type === 'string' && !v.multiline" v-model="values[k]" type="text" :mfmAutocomplete="v.treatAsMfm">
<MkInput v-else-if="v.type === 'string' && !v.multiline" v-model="values[k]" type="text" :mfmAutocomplete="v.treatAsMfm" :manualSave="v.manualSave">
<template #label><span v-text="v.label || k"></span><span v-if="v.required === false"> ({{ i18n.ts.optional }})</span></template>
<template v-if="v.description" #caption>{{ v.description }}</template>
</MkInput>
<MkTextarea v-else-if="v.type === 'string' && v.multiline" v-model="values[k]" :mfmAutocomplete="v.treatAsMfm" :mfmPreview="v.treatAsMfm">
<MkTextarea v-else-if="v.type === 'string' && v.multiline" v-model="values[k]" :mfmAutocomplete="v.treatAsMfm" :mfmPreview="v.treatAsMfm" :manualSave="v.manualSave">
<template #label><span v-text="v.label || k"></span><span v-if="v.required === false"> ({{ i18n.ts.optional }})</span></template>
<template v-if="v.description" #caption>{{ v.description }}</template>
</MkTextarea>

11
packages/frontend/src/components/MkWidgetSettingsDialog.vue
View File

@ -29,7 +29,6 @@ SPDX-License-Identifier: AGPL-3.0-only
>
<component
:is="`widget-${widgetName}`"
:key="currentId"
:widget="{ name: widgetName, id: '__PREVIEW__', data: settings }"
></component>
</div>
@ -48,13 +47,12 @@ SPDX-License-Identifier: AGPL-3.0-only
<script setup lang="ts">
import { reactive, useTemplateRef, ref, computed, watch, onBeforeUnmount, onMounted } from 'vue';
import MkPreviewWithControls from './MkPreviewWithControls.vue';
import type { Form } from '@/utility/form.js';
import { deepClone } from '@/utility/clone.js';
import { genId } from '@/utility/id.js';
import { i18n } from '@/i18n.js';
import MkModalWindow from '@/components/MkModalWindow.vue';
import MkPreviewWithControls from './MkPreviewWithControls.vue';
import MkForm from '@/components/MkForm.vue';
import type { Form } from '@/utility/form.js';
const props = defineProps<{
widgetName: string;
@ -71,11 +69,6 @@ const emit = defineEmits<{
const dialog = useTemplateRef('dialog');
const settings = reactive<Record<string, any>>(deepClone(props.currentSettings));
const currentId = ref(genId());
watch(settings, () => {
currentId.value = genId();
});
function save() {
emit('saved', deepClone(settings));

10
packages/frontend/src/utility/form.ts
View File

@ -25,6 +25,7 @@ export interface StringFormItem extends FormItemBase {
required?: boolean;
multiline?: boolean;
treatAsMfm?: boolean;
manualSave?: boolean;
}
export interface NumberFormItem extends FormItemBase {
@ -33,6 +34,7 @@ export interface NumberFormItem extends FormItemBase {
description?: string;
required?: boolean;
step?: number;
manualSave?: boolean;
}
export interface BooleanFormItem extends FormItemBase {
@ -145,3 +147,11 @@ type GetItemType<Item extends FormItem> =
export type GetFormResultType<F extends Form> = {
[P in keyof F]: GetItemType<F[P]>;
};
export function getDefaultFormValues<F extends FormWithDefault>(form: F): GetFormResultType<F> {
const result = {} as GetFormResultType<F>;
for (const key of Object.keys(form) as (keyof F)[]) {
result[key] = form[key].default as GetItemType<F[typeof key]>;
}
return result;
}

2
packages/frontend/src/widgets/WidgetActivity.vue
View File

@ -38,10 +38,12 @@ const name = 'activity';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
view: {

2
packages/frontend/src/widgets/WidgetAichan.vue
View File

@ -12,6 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { onMounted, onUnmounted, useTemplateRef } from 'vue';
import { useWidgetPropsManager } from './widget.js';
import { i18n } from '@/i18n.js';
import type { WidgetComponentProps, WidgetComponentEmits, WidgetComponentExpose } from './widget.js';
import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
@ -20,6 +21,7 @@ const name = 'ai';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
} satisfies FormWithDefault;

2
packages/frontend/src/widgets/WidgetAiscript.vue
View File

@ -37,10 +37,12 @@ const name = 'aiscript';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
script: {
type: 'string',
label: i18n.ts.script,
multiline: true,
default: '(1 + 1)',
hidden: true,

3
packages/frontend/src/widgets/WidgetAiscriptApp.vue
View File

@ -24,6 +24,7 @@ import type { AsUiComponent, AsUiRoot } from '@/aiscript/ui.js';
import * as os from '@/os.js';
import { aiScriptReadline, createAiScriptEnv } from '@/aiscript/api.js';
import { $i } from '@/i.js';
import { i18n } from '@/i18n.js';
import MkAsUi from '@/components/MkAsUi.vue';
import MkContainer from '@/components/MkContainer.vue';
import { registerAsUiLib } from '@/aiscript/ui.js';
@ -33,11 +34,13 @@ const name = 'aiscriptApp';
const widgetPropsDef = {
script: {
type: 'string',
label: i18n.ts.script,
multiline: true,
default: '',
},
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
} satisfies FormWithDefault;

3
packages/frontend/src/widgets/WidgetBirthdayFollowings.vue
View File

@ -33,11 +33,12 @@ import { misskeyApi } from '@/utility/misskey-api.js';
import { i18n } from '@/i18n.js';
import { $i } from '@/i.js';
const name = i18n.ts._widgets.birthdayFollowings;
const name = 'birthdayFollowings';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
} satisfies FormWithDefault;

4
packages/frontend/src/widgets/WidgetButton.vue
View File

@ -20,20 +20,24 @@ import * as os from '@/os.js';
import { aiScriptReadline, createAiScriptEnv } from '@/aiscript/api.js';
import { $i } from '@/i.js';
import MkButton from '@/components/MkButton.vue';
import { i18n } from '@/i18n.js';
const name = 'button';
const widgetPropsDef = {
label: {
type: 'string',
label: i18n.ts.label,
default: 'BUTTON',
},
colored: {
type: 'boolean',
label: i18n.ts._widgetOptions._button.colored,
default: true,
},
script: {
type: 'string',
label: i18n.ts.script,
multiline: true,
default: 'Mk:dialog("hello" "world")',
},

1
packages/frontend/src/widgets/WidgetCalendar.vue
View File

@ -50,6 +50,7 @@ const name = 'calendar';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
} satisfies FormWithDefault;

1
packages/frontend/src/widgets/WidgetChat.vue
View File

@ -29,6 +29,7 @@ const name = 'chat';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
} satisfies FormWithDefault;

2
packages/frontend/src/widgets/WidgetClicker.vue
View File

@ -15,6 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import { useWidgetPropsManager } from './widget.js';
import type { WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
import { i18n } from '@/i18n.js';
import MkContainer from '@/components/MkContainer.vue';
import MkClickerGame from '@/components/MkClickerGame.vue';
@ -23,6 +24,7 @@ const name = 'clicker';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: false,
},
} satisfies FormWithDefault;

42
packages/frontend/src/widgets/WidgetClock.vue
View File

@ -44,10 +44,12 @@ const name = 'clock';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
size: {
type: 'radio',
label: i18n.ts._widgetOptions._clock.size,
default: 'medium',
options: [{
value: 'small' as const,
@ -62,79 +64,89 @@ const widgetPropsDef = {
},
thickness: {
type: 'radio',
label: i18n.ts._widgetOptions._clock.thickness,
default: 0.2,
options: [{
value: 0.1 as const,
label: 'thin',
label: i18n.ts._widgetOptions._clock.thicknessThin,
}, {
value: 0.2 as const,
label: 'medium',
label: i18n.ts._widgetOptions._clock.thicknessMedium,
}, {
value: 0.3 as const,
label: 'thick',
label: i18n.ts._widgetOptions._clock.thicknessThick,
}],
},
graduations: {
type: 'radio',
label: i18n.ts._widgetOptions._clock.graduations,
default: 'numbers',
options: [{
value: 'none' as const,
label: 'None',
label: i18n.ts.none,
}, {
value: 'dots' as const,
label: 'Dots',
label: i18n.ts._widgetOptions._clock.graduationDots,
}, {
value: 'numbers' as const,
label: 'Numbers',
}],
label: i18n.ts._widgetOptions._clock.graduationArabic,
}, /*, {
value: 'roman' as const,
label: i18n.ts._widgetOptions._clock.graduationRoman,
}*/],
},
fadeGraduations: {
type: 'boolean',
label: i18n.ts._widgetOptions._clock.fadeGraduations,
default: true,
},
sAnimation: {
type: 'radio',
label: i18n.ts._widgetOptions._clock.sAnimation,
default: 'elastic',
options: [{
value: 'none' as const,
label: 'None',
label: i18n.ts.none,
}, {
value: 'elastic' as const,
label: 'Elastic',
label: i18n.ts._widgetOptions._clock.sAnimationElastic,
}, {
value: 'easeOut' as const,
label: 'Ease out',
label: i18n.ts._widgetOptions._clock.sAnimationEaseOut,
}],
},
twentyFour: {
type: 'boolean',
label: i18n.ts._widgetOptions._clock.twentyFour,
default: false,
},
label: {
type: 'radio',
label: i18n.ts.label,
default: 'none',
options: [{
value: 'none' as const,
label: 'None',
label: i18n.ts.none,
}, {
value: 'time' as const,
label: 'Time',
label: i18n.ts._widgetOptions._clock.labelTime,
}, {
value: 'tz' as const,
label: 'TZ',
label: i18n.ts._widgetOptions._clock.labelTz,
}, {
value: 'timeAndTz' as const,
label: 'Time + TZ',
label: i18n.ts._widgetOptions._clock.labelTimeAndTz,
}],
},
timezone: {
type: 'enum',
label: i18n.ts._widgetOptions._clock.timezone,
default: null,
enum: [...timezones.map((tz) => ({
label: tz.name,
value: tz.name.toLowerCase(),
})), {
label: '(auto)',
label: i18n.ts.auto,
value: null,
}],
},

8
packages/frontend/src/widgets/WidgetDigitalClock.vue
View File

@ -19,6 +19,7 @@ import { useWidgetPropsManager } from './widget.js';
import type { WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
import { timezones } from '@/utility/timezones.js';
import { i18n } from '@/i18n.js';
import MkDigitalClock from '@/components/MkDigitalClock.vue';
const name = 'digitalClock';
@ -26,29 +27,34 @@ const name = 'digitalClock';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
fontSize: {
type: 'number',
label: i18n.ts.fontSize,
default: 1.5,
step: 0.1,
},
showMs: {
type: 'boolean',
label: i18n.ts._widgetOptions._clock.showMs,
default: true,
},
showLabel: {
type: 'boolean',
label: i18n.ts._widgetOptions._clock.showLabel,
default: true,
},
timezone: {
type: 'enum',
label: i18n.ts._widgetOptions._clock.timezone,
default: null,
enum: [...timezones.map((tz) => ({
label: tz.name,
value: tz.name.toLowerCase(),
})), {
label: '(auto)',
label: i18n.ts.auto,
value: null,
}],
},

1
packages/frontend/src/widgets/WidgetFederation.vue
View File

@ -43,6 +43,7 @@ const name = 'federation';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
} satisfies FormWithDefault;

2
packages/frontend/src/widgets/WidgetInstanceCloud.vue
View File

@ -29,12 +29,14 @@ import MkTagCloud from '@/components/MkTagCloud.vue';
import * as os from '@/os.js';
import { misskeyApi } from '@/utility/misskey-api.js';
import { getProxiedImageUrlNullable } from '@/utility/media-proxy.js';
import { i18n } from '@/i18n.js';
const name = 'instanceCloud';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
} satisfies FormWithDefault;

3
packages/frontend/src/widgets/WidgetJobQueue.vue
View File

@ -61,16 +61,19 @@ import * as sound from '@/utility/sound.js';
import { deepClone } from '@/utility/clone.js';
import { prefer } from '@/preferences.js';
import { genId } from '@/utility/id.js';
import { i18n } from '@/i18n.js';
const name = 'jobQueue';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
sound: {
type: 'boolean',
label: i18n.ts._widgetOptions._jobQueue.sound,
default: false,
},
} satisfies FormWithDefault;

2
packages/frontend/src/widgets/WidgetMemo.vue
View File

@ -29,10 +29,12 @@ const name = 'memo';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
height: {
type: 'number',
label: i18n.ts.height,
default: 100,
},
} satisfies FormWithDefault;

2
packages/frontend/src/widgets/WidgetNotifications.vue
View File

@ -31,10 +31,12 @@ const name = 'notifications';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
height: {
type: 'number',
label: i18n.ts.height,
default: 300,
},
excludeTypes: {

1
packages/frontend/src/widgets/WidgetOnlineUsers.vue
View File

@ -28,6 +28,7 @@ const name = 'onlineUsers';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: true,
},
} satisfies FormWithDefault;

2
packages/frontend/src/widgets/WidgetPhotos.vue
View File

@ -39,10 +39,12 @@ const name = 'photos';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
} satisfies FormWithDefault;

11
packages/frontend/src/widgets/WidgetRss.vue
View File

@ -25,28 +25,33 @@ import * as Misskey from 'misskey-js';
import { url as base } from '@@/js/config.js';
import { useInterval } from '@@/js/use-interval.js';
import { useWidgetPropsManager } from './widget.js';
import { i18n } from '@/i18n.js';
import type { WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
import MkContainer from '@/components/MkContainer.vue';
import { i18n } from '@/i18n.js';
const name = 'rss';
const widgetPropsDef = {
url: {
type: 'string',
label: i18n.ts._widgetOptions._rss.url,
default: 'http://feeds.afpbb.com/rss/afpbb/afpbbnews',
manualSave: true,
},
refreshIntervalSec: {
type: 'number',
label: i18n.ts._widgetOptions._rss.refreshIntervalSec,
default: 60,
},
maxEntries: {
type: 'number',
label: i18n.ts._widgetOptions._rss.maxEntries,
default: 15,
},
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
} satisfies FormWithDefault;
@ -68,7 +73,7 @@ const fetching = ref(true);
const fetchEndpoint = computed(() => {
const url = new URL('/api/fetch-rss', base);
url.searchParams.set('url', widgetProps.url);
return url;
return url.toString();
});
const intervalClear = ref<(() => void) | undefined>();
@ -83,7 +88,7 @@ const tick = () => {
});
};
watch(() => fetchEndpoint, tick);
watch(fetchEndpoint, tick);
watch(() => widgetProps.refreshIntervalSec, () => {
if (intervalClear.value) {
intervalClear.value();

12
packages/frontend/src/widgets/WidgetRssTicker.vue
View File

@ -35,6 +35,7 @@ import MkMarqueeText from '@/components/MkMarqueeText.vue';
import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
import MkContainer from '@/components/MkContainer.vue';
import { shuffle } from '@/utility/shuffle.js';
import { i18n } from '@/i18n.js';
import { url as base } from '@@/js/config.js';
import { useInterval } from '@@/js/use-interval.js';
@ -43,22 +44,28 @@ const name = 'rssTicker';
const widgetPropsDef = {
url: {
type: 'string',
label: i18n.ts._widgetOptions._rss.url,
default: 'http://feeds.afpbb.com/rss/afpbb/afpbbnews',
manualSave: true,
},
shuffle: {
type: 'boolean',
label: i18n.ts._widgetOptions._rssTicker.shuffle,
default: true,
},
refreshIntervalSec: {
type: 'number',
label: i18n.ts._widgetOptions._rss.refreshIntervalSec,
default: 60,
},
maxEntries: {
type: 'number',
label: i18n.ts._widgetOptions._rss.maxEntries,
default: 15,
},
duration: {
type: 'range',
label: i18n.ts._widgetOptions._rssTicker.duration,
default: 70,
step: 1,
min: 5,
@ -66,14 +73,17 @@ const widgetPropsDef = {
},
reverse: {
type: 'boolean',
label: i18n.ts._widgetOptions._rssTicker.reverse,
default: false,
},
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: false,
},
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
} satisfies FormWithDefault;
@ -119,7 +129,7 @@ const tick = () => {
});
};
watch(() => fetchEndpoint, tick);
watch(fetchEndpoint, tick);
watch(() => widgetProps.refreshIntervalSec, () => {
if (intervalClear.value) {
intervalClear.value();

1
packages/frontend/src/widgets/WidgetSlideshow.vue
View File

@ -33,6 +33,7 @@ const name = 'slideshow';
const widgetPropsDef = {
height: {
type: 'number',
label: i18n.ts._widgetOptions.height,
default: 300,
},
folderId: {

1
packages/frontend/src/widgets/WidgetTrends.vue
View File

@ -41,6 +41,7 @@ const name = 'hashtags';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
} satisfies FormWithDefault;

5
packages/frontend/src/widgets/WidgetUnixClock.vue
View File

@ -18,6 +18,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { onUnmounted, ref, watch } from 'vue';
import { useWidgetPropsManager } from './widget.js';
import { i18n } from '@/i18n.js';
import type { WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
@ -26,19 +27,23 @@ const name = 'unixClock';
const widgetPropsDef = {
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
fontSize: {
type: 'number',
label: i18n.ts.fontSize,
default: 1.5,
step: 0.1,
},
showMs: {
type: 'boolean',
label: i18n.ts._widgetOptions._clock.showMs,
default: true,
},
showLabel: {
type: 'boolean',
label: i18n.ts._widgetOptions._clock.showLabel,
default: true,
},
} satisfies FormWithDefault;

1
packages/frontend/src/widgets/WidgetUserList.vue
View File

@ -41,6 +41,7 @@ const name = 'userList';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
listId: {

2
packages/frontend/src/widgets/server-metric/index.vue
View File

@ -40,10 +40,12 @@ const name = 'serverMetric';
const widgetPropsDef = {
showHeader: {
type: 'boolean',
label: i18n.ts._widgetOptions.showHeader,
default: true,
},
transparent: {
type: 'boolean',
label: i18n.ts._widgetOptions.transparent,
default: false,
},
view: {

30
packages/frontend/src/widgets/widget.ts
View File

@ -4,11 +4,13 @@
*/
import { defineAsyncComponent, reactive, watch } from 'vue';
import type { Reactive } from 'vue';
import { throttle } from 'throttle-debounce';
import { getDefaultFormValues } from '@/utility/form.js';
import type { Reactive } from 'vue';
import type { FormWithDefault, GetFormResultType } from '@/utility/form.js';
import * as os from '@/os.js';
import { deepClone } from '@/utility/clone.js';
import { i18n } from '@/i18n';
export type Widget<P extends Record<string, unknown>> = {
id: string;
@ -39,19 +41,23 @@ export const useWidgetPropsManager = <F extends FormWithDefault>(
save: () => void;
configure: () => void;
} => {
const widgetProps = reactive<GetFormResultType<F>>((props.widget ? deepClone(props.widget.data) : {}) as GetFormResultType<F>);
const mergeProps = () => {
for (const prop of Object.keys(propsDef)) {
if (typeof widgetProps[prop] === 'undefined') {
widgetProps[prop] = propsDef[prop].default;
const widgetProps = reactive((() => {
const np = getDefaultFormValues(propsDef);
if (props.widget?.data != null) {
for (const key of Object.keys(props.widget.data) as (keyof F)[]) {
np[key] = props.widget.data[key] as GetFormResultType<F>[typeof key];
}
}
};
return np;
})());
watch(widgetProps, () => {
mergeProps();
}, { deep: true, immediate: true });
watch(() => props.widget?.data, (to) => {
if (to != null) {
for (const key of Object.keys(propsDef)) {
widgetProps[key] = to[key];
}
}
}, { deep: true });
const save = throttle(3000, () => {
emit('updateProps', widgetProps as GetFormResultType<F>);
@ -70,7 +76,7 @@ export const useWidgetPropsManager = <F extends FormWithDefault>(
canceled: true;
}>((resolve) => {
const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkWidgetSettingsDialog.vue')), {
widgetName: name,
widgetName: i18n.ts._widgets[name] ?? name,
form: form,
currentSettings: widgetProps,
}, {

132
packages/i18n/src/autogen/locale.ts
View File

@ -9901,6 +9901,138 @@ export interface Locale extends ILocale {
*/
"chat": string;
};
"_widgetOptions": {
/**
* ヘッダーを表示
*/
"showHeader": string;
/**
* 背景を透明にする
*/
"transparent": string;
/**
* 高さ
*/
"height": string;
"_button": {
/**
* 色付き
*/
"colored": string;
};
"_clock": {
/**
* サイズ
*/
"size": string;
/**
* 針の太さ
*/
"thickness": string;
/**
* 細い
*/
"thicknessThin": string;
/**
* 普通
*/
"thicknessMedium": string;
/**
* 太い
*/
"thicknessThick": string;
/**
* 文字盤の目盛り
*/
"graduations": string;
/**
* ドット
*/
"graduationDots": string;
/**
* アラビア数字
*/
"graduationArabic": string;
/**
* 目盛りをフェード
*/
"fadeGraduations": string;
/**
* 秒針のアニメーション
*/
"sAnimation": string;
/**
* リアル
*/
"sAnimationElastic": string;
/**
* 滑らか
*/
"sAnimationEaseOut": string;
/**
* 24時間表示
*/
"twentyFour": string;
/**
* 時刻
*/
"labelTime": string;
/**
* タイムゾーン
*/
"labelTz": string;
/**
* 時刻とタイムゾーン
*/
"labelTimeAndTz": string;
/**
* タイムゾーン
*/
"timezone": string;
/**
* ミリ秒を表示
*/
"showMs": string;
/**
* ラベルを表示
*/
"showLabel": string;
};
"_jobQueue": {
/**
* 音を鳴らす
*/
"sound": string;
};
"_rss": {
/**
* RSSフィードのURL
*/
"url": string;
/**
* 更新間隔(秒)
*/
"refreshIntervalSec": string;
/**
* 最大表示件数
*/
"maxEntries": string;
};
"_rssTicker": {
/**
* 表示順をシャッフル
*/
"shuffle": string;
/**
* ティッカーのスクロール速度(秒)
*/
"duration": string;
/**
* 逆方向にスクロール
*/
"reverse": string;
};
};
"_cw": {
/**
* 隠す