OpenSource/misskey
OpenSource/misskey
1
0
Fork 0
mirror of https://github.com/misskey-dev/misskey.git synced 2024-12-27 10:20:27 +01:00
Code Issues Projects Releases Packages Wiki Activity

enhance(frontend): ウィジェット

Browse source
This commit is contained in:
kakkokari-gtyih 2024-12-10 15:22:44 +09:00
parent eb0a2f4b9f
commit 0ac6e05008
2 changed files with 23 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
packages/frontend/src/components/MkWidgets.vue
View file

@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<header :class="$style.editHeader">
<MkSelect v-model="widgetAdderSelected" style="margin-bottom: var(--MI-margin)" data-cy-widget-select>
<template #label>{{ i18n.ts.selectWidget }}</template>
<option v-for="widget in widgetDefs" :key="widget" :value="widget">{{ i18n.ts._widgets[widget] }}</option>
<option v-for="widget in _widgetDefs" :key="widget" :value="widget">{{ i18n.ts._widgets[widget] }}</option>
</MkSelect>
<MkButton inline primary data-cy-widget-add @click="addWidget"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton>
<MkButton inline @click="emit('exit')">{{ i18n.ts.close }}</MkButton>
@ -34,7 +34,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
</Sortable>
</template>
<component :is="`widget-${widget.name}`" v-for="widget in widgets" v-else :key="widget.id" :ref="el => widgetRefs[widget.id] = el" :class="$style.widget" :widget="widget" @updateProps="updateWidget(widget.id, $event)" @contextmenu.stop="onContextmenu(widget, $event)"/>
<component :is="`widget-${widget.name}`" v-for="widget in _widgets" v-else :key="widget.id" :ref="el => widgetRefs[widget.id] = el" :class="$style.widget" :widget="widget" @updateProps="updateWidget(widget.id, $event)" @contextmenu.stop="onContextmenu(widget, $event)"/>
</div>
</template>
@ -50,13 +50,14 @@ export type DefaultStoredWidget = {
</script>
<script lang="ts" setup>
import { defineAsyncComponent, ref } from 'vue';
import { defineAsyncComponent, ref, computed } from 'vue';
import { v4 as uuid } from 'uuid';
import MkSelect from '@/components/MkSelect.vue';
import MkButton from '@/components/MkButton.vue';
import { widgets as widgetDefs } from '@/widgets/index.js';
import { widgets as widgetDefs, federationWidgets } from '@/widgets/index.js';
import * as os from '@/os.js';
import { i18n } from '@/i18n.js';
import { instance } from '@/instance.js';
import { isLink } from '@@/js/is-link.js';
const Sortable = defineAsyncComponent(() => import('vuedraggable').then(x => x.default));
@ -66,6 +67,16 @@ const props = defineProps<{
edit: boolean;
}>();
const _widgetDefs = computed(() => {
if (instance.federation === 'none') {
return widgetDefs.filter(x => !federationWidgets.includes(x));
} else {
return widgetDefs;
}
});
const _widgets = computed(() => props.widgets.filter(x => _widgetDefs.value.includes(x.name)));
const emit = defineEmits<{
(ev: 'updateWidgets', widgets: Widget[]): void;
(ev: 'addWidget', widget: Widget): void;

10
packages/frontend/src/widgets/index.ts
View file

@ -36,6 +36,12 @@ export default function(app: App) {
app.component('WidgetBirthdayFollowings', defineAsyncComponent(() => import('./WidgetBirthdayFollowings.vue')));
}
// 連合関連のウィジェット（連合無効時に隠す）
export const federationWidgets = [
'federation',
'instanceCloud',
];
export const widgets = [
'profile',
'instanceInfo',
@ -51,8 +57,6 @@ export const widgets = [
'photos',
'digitalClock',
'unixClock',
'federation',
'instanceCloud',
'postForm',
'slideshow',
'serverMetric',
@ -65,4 +69,6 @@ export const widgets = [
'userList',
'clicker',
'birthdayFollowings',
...federationWidgets,
];