Merge branch 'develop' into feat-1714
This commit is contained in:
commit
24c7fb38a0
165 changed files with 6316 additions and 4265 deletions
|
|
@ -258,6 +258,12 @@ const patronsWithIcon = [{
|
|||
}, {
|
||||
name: 'えとゔぁす',
|
||||
icon: 'https://assets.misskey-hub.net/patrons/2578f441b82a44cfaa55ba83a318b26e.jpg',
|
||||
}, {
|
||||
name: 'Soli',
|
||||
icon: 'https://assets.misskey-hub.net/patrons/448070c81ebd41eda4ea2328291b2efe.jpg',
|
||||
}, {
|
||||
name: 'ささくれりょう',
|
||||
icon: 'https://assets.misskey-hub.net/patrons/cf55022cee6c41da8e70a43587aaad9a.jpg',
|
||||
}];
|
||||
|
||||
const patrons = [
|
||||
|
|
|
|||
|
|
@ -71,9 +71,9 @@ const pagination = {
|
|||
sort: sort.value,
|
||||
host: host.value !== '' ? host.value : null,
|
||||
...(
|
||||
state.value === 'federating' ? { federating: true } :
|
||||
state.value === 'subscribing' ? { subscribing: true } :
|
||||
state.value === 'publishing' ? { publishing: true } :
|
||||
state.value === 'federating' ? { federating: true, suspended: false, blocked: false } :
|
||||
state.value === 'subscribing' ? { subscribing: true, suspended: false, blocked: false } :
|
||||
state.value === 'publishing' ? { publishing: true, suspended: false, blocked: false } :
|
||||
state.value === 'suspended' ? { suspended: true } :
|
||||
state.value === 'blocked' ? { blocked: true } :
|
||||
state.value === 'silenced' ? { silenced: true } :
|
||||
|
|
|
|||
|
|
@ -24,8 +24,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<div class="buttons right">
|
||||
<template v-if="actions">
|
||||
<template v-for="action in actions">
|
||||
<MkButton v-if="action.asFullButton" class="fullButton" primary @click.stop="action.handler"><i :class="action.icon" style="margin-right: 6px;"></i>{{ action.text }}</MkButton>
|
||||
<button v-else v-tooltip.noDelay="action.text" class="_button button" :class="{ highlighted: action.highlighted }" @click.stop="action.handler" @touchstart="preventDrag"><i :class="action.icon"></i></button>
|
||||
<MkButton v-if="action.asFullButton" class="fullButton" primary :disabled="action.disabled" @click.stop="action.handler"><i :class="action.icon" style="margin-right: 6px;"></i>{{ action.text }}</MkButton>
|
||||
<button v-else v-tooltip.noDelay="action.text" class="_button button" :class="{ highlighted: action.highlighted }" :disabled="action.disabled" @click.stop="action.handler" @touchstart="preventDrag"><i :class="action.icon"></i></button>
|
||||
</template>
|
||||
</template>
|
||||
</div>
|
||||
|
|
@ -56,6 +56,7 @@ const props = defineProps<{
|
|||
text: string;
|
||||
icon: string;
|
||||
asFullButton?: boolean;
|
||||
disabled?: boolean;
|
||||
handler: (ev: MouseEvent) => void;
|
||||
}[];
|
||||
thin?: boolean;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
|
||||
<template>
|
||||
<MkModalWindow
|
||||
ref="dialog"
|
||||
ref="dialogEl"
|
||||
:width="400"
|
||||
:height="490"
|
||||
:withOkButton="false"
|
||||
|
|
@ -16,8 +16,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template #header>
|
||||
{{ mode === 'create' ? i18n.ts._abuseReport._notificationRecipient.createRecipient : i18n.ts._abuseReport._notificationRecipient.modifyRecipient }}
|
||||
</template>
|
||||
<div v-if="loading === 0">
|
||||
<MkSpacer :marginMin="20" :marginMax="28">
|
||||
<div v-if="loading === 0" style="display: flex; flex-direction: column; min-height: 100%;">
|
||||
<MkSpacer :marginMin="20" :marginMax="28" style="flex-grow: 1;">
|
||||
<div :class="$style.root" class="_gaps_m">
|
||||
<MkInput v-model="title">
|
||||
<template #label>{{ i18n.ts.title }}</template>
|
||||
|
|
@ -44,7 +44,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
{{ webhook.name }}
|
||||
</option>
|
||||
</MkSelect>
|
||||
<MkButton rounded @click="onEditSystemWebhookClicked">
|
||||
<MkButton rounded :class="$style.systemWebhookEditButton" @click="onEditSystemWebhookClicked">
|
||||
<span v-if="systemWebhookId === null" class="ti ti-plus" style="line-height: normal"/>
|
||||
<span v-else class="ti ti-settings" style="line-height: normal"/>
|
||||
</MkButton>
|
||||
|
|
@ -60,8 +60,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</MkSpacer>
|
||||
|
||||
<div :class="$style.footer" class="_buttonsCenter">
|
||||
<MkButton primary :disabled="disableSubmitButton" @click="onSubmitClicked"><i class="ti ti-check"></i> {{ i18n.ts.ok }}</MkButton>
|
||||
<MkButton @click="onCancelClicked"><i class="ti ti-x"></i> {{ i18n.ts.cancel }}</MkButton>
|
||||
<MkButton primary rounded :disabled="disableSubmitButton" @click="onSubmitClicked"><i class="ti ti-check"></i> {{ i18n.ts.ok }}</MkButton>
|
||||
<MkButton rounded @click="onCancelClicked"><i class="ti ti-x"></i> {{ i18n.ts.cancel }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
|
|
@ -71,7 +71,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, onMounted, ref, toRefs } from 'vue';
|
||||
import { computed, onMounted, ref, shallowRef, toRefs } from 'vue';
|
||||
import { entities } from 'misskey-js';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
import MkModalWindow from '@/components/MkModalWindow.vue';
|
||||
|
|
@ -88,6 +88,7 @@ type NotificationRecipientMethod = 'email' | 'webhook';
|
|||
|
||||
const emit = defineEmits<{
|
||||
(ev: 'submitted'): void;
|
||||
(ev: 'canceled'): void;
|
||||
(ev: 'closed'): void;
|
||||
}>();
|
||||
|
||||
|
|
@ -98,6 +99,8 @@ const props = defineProps<{
|
|||
|
||||
const { mode, id } = toRefs(props);
|
||||
|
||||
const dialogEl = shallowRef<InstanceType<typeof MkModalWindow>>();
|
||||
|
||||
const loading = ref<number>(0);
|
||||
|
||||
const title = ref<string>('');
|
||||
|
|
@ -166,18 +169,21 @@ async function onSubmitClicked() {
|
|||
}
|
||||
}
|
||||
|
||||
dialogEl.value?.close();
|
||||
emit('submitted');
|
||||
// eslint-disable-next-line
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
} catch (ex: any) {
|
||||
const msg = ex.message ?? i18n.ts.internalServerErrorDescription;
|
||||
await os.alert({ type: 'error', title: i18n.ts.error, text: msg });
|
||||
emit('closed');
|
||||
dialogEl.value?.close();
|
||||
emit('canceled');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function onCancelClicked() {
|
||||
emit('closed');
|
||||
dialogEl.value?.close();
|
||||
emit('canceled');
|
||||
}
|
||||
|
||||
async function onEditSystemWebhookClicked() {
|
||||
|
|
@ -262,7 +268,8 @@ onMounted(async () => {
|
|||
} catch (ex: any) {
|
||||
const msg = ex.message ?? i18n.ts.internalServerErrorDescription;
|
||||
await os.alert({ type: 'error', title: i18n.ts.error, text: msg });
|
||||
emit('closed');
|
||||
dialogEl.value?.close();
|
||||
emit('canceled');
|
||||
}
|
||||
} else {
|
||||
userId.value = moderators.value[0]?.id ?? null;
|
||||
|
|
@ -282,10 +289,15 @@ onMounted(async () => {
|
|||
}
|
||||
|
||||
.footer {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: flex-end;
|
||||
margin-top: 20px;
|
||||
position: sticky;
|
||||
z-index: 10000;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 12px;
|
||||
border-top: solid 0.5px var(--divider);
|
||||
background: var(--acrylicBg);
|
||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||
backdrop-filter: var(--blur, blur(15px));
|
||||
}
|
||||
|
||||
.systemWebhook {
|
||||
|
|
@ -294,14 +306,16 @@ onMounted(async () => {
|
|||
justify-content: stretch;
|
||||
align-items: flex-end;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
button {
|
||||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
min-width: 2.5em;
|
||||
min-height: 2.5em;
|
||||
box-sizing: border-box;
|
||||
padding: 6px;
|
||||
}
|
||||
.systemWebhookEditButton {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
flex-shrink: 0;
|
||||
box-sizing: border-box;
|
||||
margin: 1px 0;
|
||||
padding: 6px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -108,26 +108,27 @@ async function onDeleteButtonClicked(id: string) {
|
|||
}
|
||||
|
||||
async function showEditor(mode: 'create' | 'edit', id?: string) {
|
||||
const { dispose, needLoad } = await new Promise<{ dispose: () => void, needLoad: boolean }>(async resolve => {
|
||||
const { dispose: _dispose } = os.popup(
|
||||
const { needLoad } = await new Promise<{ needLoad: boolean }>(async resolve => {
|
||||
const { dispose } = os.popup(
|
||||
defineAsyncComponent(() => import('./notification-recipient.editor.vue')),
|
||||
{
|
||||
mode,
|
||||
id,
|
||||
},
|
||||
{
|
||||
submitted: async () => {
|
||||
resolve({ dispose: _dispose, needLoad: true });
|
||||
submitted: () => {
|
||||
resolve({ needLoad: true });
|
||||
},
|
||||
canceled: () => {
|
||||
resolve({ needLoad: false });
|
||||
},
|
||||
closed: () => {
|
||||
resolve({ dispose: _dispose, needLoad: false });
|
||||
dispose();
|
||||
},
|
||||
},
|
||||
);
|
||||
});
|
||||
|
||||
dispose();
|
||||
|
||||
if (needLoad) {
|
||||
await fetchRecipients();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,70 +11,83 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkInfo>{{ i18n.ts._announcement.shouldNotBeUsedToPresentPermanentInfo }}</MkInfo>
|
||||
<MkInfo v-if="announcements.length > 5" warn>{{ i18n.ts._announcement.tooManyActiveAnnouncementDescription }}</MkInfo>
|
||||
|
||||
<MkFolder v-for="announcement in announcements" :key="announcement.id ?? announcement._id" :defaultOpen="announcement.id == null">
|
||||
<template #label>{{ announcement.title }}</template>
|
||||
<template #icon>
|
||||
<i v-if="announcement.icon === 'info'" class="ti ti-info-circle"></i>
|
||||
<i v-else-if="announcement.icon === 'warning'" class="ti ti-alert-triangle" style="color: var(--warn);"></i>
|
||||
<i v-else-if="announcement.icon === 'error'" class="ti ti-circle-x" style="color: var(--error);"></i>
|
||||
<i v-else-if="announcement.icon === 'success'" class="ti ti-check" style="color: var(--success);"></i>
|
||||
</template>
|
||||
<template #caption>{{ announcement.text }}</template>
|
||||
<MkSelect v-model="announcementsStatus">
|
||||
<template #label>{{ i18n.ts.filter }}</template>
|
||||
<option value="active">{{ i18n.ts.active }}</option>
|
||||
<option value="archived">{{ i18n.ts.archived }}</option>
|
||||
</MkSelect>
|
||||
|
||||
<div class="_gaps_m">
|
||||
<MkInput v-model="announcement.title">
|
||||
<template #label>{{ i18n.ts.title }}</template>
|
||||
</MkInput>
|
||||
<MkTextarea v-model="announcement.text" mfmAutocomplete :mfmPreview="true">
|
||||
<template #label>{{ i18n.ts.text }}</template>
|
||||
</MkTextarea>
|
||||
<MkInput v-model="announcement.imageUrl" type="url">
|
||||
<template #label>{{ i18n.ts.imageUrl }}</template>
|
||||
</MkInput>
|
||||
<MkRadios v-model="announcement.icon">
|
||||
<template #label>{{ i18n.ts.icon }}</template>
|
||||
<option value="info"><i class="ti ti-info-circle"></i></option>
|
||||
<option value="warning"><i class="ti ti-alert-triangle" style="color: var(--warn);"></i></option>
|
||||
<option value="error"><i class="ti ti-circle-x" style="color: var(--error);"></i></option>
|
||||
<option value="success"><i class="ti ti-check" style="color: var(--success);"></i></option>
|
||||
</MkRadios>
|
||||
<MkRadios v-model="announcement.display">
|
||||
<template #label>{{ i18n.ts.display }}</template>
|
||||
<option value="normal">{{ i18n.ts.normal }}</option>
|
||||
<option value="banner">{{ i18n.ts.banner }}</option>
|
||||
<option value="dialog">{{ i18n.ts.dialog }}</option>
|
||||
</MkRadios>
|
||||
<MkInfo v-if="announcement.display === 'dialog'" warn>{{ i18n.ts._announcement.dialogAnnouncementUxWarn }}</MkInfo>
|
||||
<MkSwitch v-model="announcement.forExistingUsers" :helpText="i18n.ts._announcement.forExistingUsersDescription">
|
||||
{{ i18n.ts._announcement.forExistingUsers }}
|
||||
</MkSwitch>
|
||||
<MkSwitch v-model="announcement.silence" :helpText="i18n.ts._announcement.silenceDescription">
|
||||
{{ i18n.ts._announcement.silence }}
|
||||
</MkSwitch>
|
||||
<MkSwitch v-model="announcement.needConfirmationToRead" :helpText="i18n.ts._announcement.needConfirmationToReadDescription">
|
||||
{{ i18n.ts._announcement.needConfirmationToRead }}
|
||||
</MkSwitch>
|
||||
<p v-if="announcement.reads">{{ i18n.tsx.nUsersRead({ n: announcement.reads }) }}</p>
|
||||
<div class="buttons _buttons">
|
||||
<MkButton class="button" inline primary @click="save(announcement)"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
|
||||
<MkButton v-if="announcement.id != null" class="button" inline @click="archive(announcement)"><i class="ti ti-check"></i> {{ i18n.ts._announcement.end }} ({{ i18n.ts.archive }})</MkButton>
|
||||
<MkButton v-if="announcement.id != null" class="button" inline danger @click="del(announcement)"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton>
|
||||
<MkLoading v-if="loading"/>
|
||||
|
||||
<template v-else>
|
||||
<MkFolder v-for="announcement in announcements" :key="announcement.id ?? announcement._id" :defaultOpen="announcement.id == null">
|
||||
<template #label>{{ announcement.title }}</template>
|
||||
<template #icon>
|
||||
<i v-if="announcement.icon === 'info'" class="ti ti-info-circle"></i>
|
||||
<i v-else-if="announcement.icon === 'warning'" class="ti ti-alert-triangle" style="color: var(--warn);"></i>
|
||||
<i v-else-if="announcement.icon === 'error'" class="ti ti-circle-x" style="color: var(--error);"></i>
|
||||
<i v-else-if="announcement.icon === 'success'" class="ti ti-check" style="color: var(--success);"></i>
|
||||
</template>
|
||||
<template #caption>{{ announcement.text }}</template>
|
||||
|
||||
<div class="_gaps_m">
|
||||
<MkInput v-model="announcement.title">
|
||||
<template #label>{{ i18n.ts.title }}</template>
|
||||
</MkInput>
|
||||
<MkTextarea v-model="announcement.text" mfmAutocomplete :mfmPreview="true">
|
||||
<template #label>{{ i18n.ts.text }}</template>
|
||||
</MkTextarea>
|
||||
<MkInput v-model="announcement.imageUrl" type="url">
|
||||
<template #label>{{ i18n.ts.imageUrl }}</template>
|
||||
</MkInput>
|
||||
<MkRadios v-model="announcement.icon">
|
||||
<template #label>{{ i18n.ts.icon }}</template>
|
||||
<option value="info"><i class="ti ti-info-circle"></i></option>
|
||||
<option value="warning"><i class="ti ti-alert-triangle" style="color: var(--warn);"></i></option>
|
||||
<option value="error"><i class="ti ti-circle-x" style="color: var(--error);"></i></option>
|
||||
<option value="success"><i class="ti ti-check" style="color: var(--success);"></i></option>
|
||||
</MkRadios>
|
||||
<MkRadios v-model="announcement.display">
|
||||
<template #label>{{ i18n.ts.display }}</template>
|
||||
<option value="normal">{{ i18n.ts.normal }}</option>
|
||||
<option value="banner">{{ i18n.ts.banner }}</option>
|
||||
<option value="dialog">{{ i18n.ts.dialog }}</option>
|
||||
</MkRadios>
|
||||
<MkInfo v-if="announcement.display === 'dialog'" warn>{{ i18n.ts._announcement.dialogAnnouncementUxWarn }}</MkInfo>
|
||||
<MkSwitch v-model="announcement.forExistingUsers" :helpText="i18n.ts._announcement.forExistingUsersDescription">
|
||||
{{ i18n.ts._announcement.forExistingUsers }}
|
||||
</MkSwitch>
|
||||
<MkSwitch v-model="announcement.silence" :helpText="i18n.ts._announcement.silenceDescription">
|
||||
{{ i18n.ts._announcement.silence }}
|
||||
</MkSwitch>
|
||||
<MkSwitch v-model="announcement.needConfirmationToRead" :helpText="i18n.ts._announcement.needConfirmationToReadDescription">
|
||||
{{ i18n.ts._announcement.needConfirmationToRead }}
|
||||
</MkSwitch>
|
||||
<p v-if="announcement.reads">{{ i18n.tsx.nUsersRead({ n: announcement.reads }) }}</p>
|
||||
<div class="buttons _buttons">
|
||||
<MkButton class="button" inline primary @click="save(announcement)"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
|
||||
<MkButton v-if="announcement.id != null && announcement.isActive" class="button" inline @click="archive(announcement)"><i class="ti ti-check"></i> {{ i18n.ts._announcement.end }} ({{ i18n.ts.archive }})</MkButton>
|
||||
<MkButton v-if="announcement.id != null && !announcement.isActive" class="button" inline @click="unarchive(announcement)"><i class="ti ti-restore"></i> {{ i18n.ts.unarchive }}</MkButton>
|
||||
<MkButton v-if="announcement.id != null" class="button" inline danger @click="del(announcement)"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</MkFolder>
|
||||
<MkButton class="button" @click="more()">
|
||||
<i class="ti ti-reload"></i>{{ i18n.ts.more }}
|
||||
</MkButton>
|
||||
</MkFolder>
|
||||
<MkLoading v-if="loadingMore"/>
|
||||
<MkButton class="button" @click="more()">
|
||||
<i class="ti ti-reload"></i>{{ i18n.ts.more }}
|
||||
</MkButton>
|
||||
</template>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed } from 'vue';
|
||||
import { ref, computed, watch } from 'vue';
|
||||
import XHeader from './_header_.vue';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
import MkInput from '@/components/MkInput.vue';
|
||||
import MkSelect from '@/components/MkSelect.vue';
|
||||
import MkSwitch from '@/components/MkSwitch.vue';
|
||||
import MkRadios from '@/components/MkRadios.vue';
|
||||
import MkInfo from '@/components/MkInfo.vue';
|
||||
|
|
@ -85,11 +98,22 @@ import { definePageMetadata } from '@/scripts/page-metadata.js';
|
|||
import MkFolder from '@/components/MkFolder.vue';
|
||||
import MkTextarea from '@/components/MkTextarea.vue';
|
||||
|
||||
const announcementsStatus = ref<'active' | 'archived'>('active');
|
||||
|
||||
const loading = ref(true);
|
||||
const loadingMore = ref(false);
|
||||
|
||||
const announcements = ref<any[]>([]);
|
||||
|
||||
misskeyApi('admin/announcements/list').then(announcementResponse => {
|
||||
announcements.value = announcementResponse;
|
||||
});
|
||||
watch(announcementsStatus, (to) => {
|
||||
loading.value = true;
|
||||
misskeyApi('admin/announcements/list', {
|
||||
status: to,
|
||||
}).then(announcementResponse => {
|
||||
announcements.value = announcementResponse;
|
||||
loading.value = false;
|
||||
});
|
||||
}, { immediate: true });
|
||||
|
||||
function add() {
|
||||
announcements.value.unshift({
|
||||
|
|
@ -125,6 +149,14 @@ async function archive(announcement) {
|
|||
refresh();
|
||||
}
|
||||
|
||||
async function unarchive(announcement) {
|
||||
await os.apiWithDialog('admin/announcements/update', {
|
||||
...announcement,
|
||||
isActive: true,
|
||||
});
|
||||
refresh();
|
||||
}
|
||||
|
||||
async function save(announcement) {
|
||||
if (announcement.id == null) {
|
||||
await os.apiWithDialog('admin/announcements/create', announcement);
|
||||
|
|
@ -135,24 +167,32 @@ async function save(announcement) {
|
|||
}
|
||||
|
||||
function more() {
|
||||
misskeyApi('admin/announcements/list', { untilId: announcements.value.reduce((acc, announcement) => announcement.id != null ? announcement : acc).id }).then(announcementResponse => {
|
||||
loadingMore.value = true;
|
||||
misskeyApi('admin/announcements/list', {
|
||||
status: announcementsStatus.value,
|
||||
untilId: announcements.value.reduce((acc, announcement) => announcement.id != null ? announcement : acc).id
|
||||
}).then(announcementResponse => {
|
||||
announcements.value = announcements.value.concat(announcementResponse);
|
||||
loadingMore.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
function refresh() {
|
||||
misskeyApi('admin/announcements/list').then(announcementResponse => {
|
||||
loading.value = true;
|
||||
misskeyApi('admin/announcements/list', {
|
||||
status: announcementsStatus.value,
|
||||
}).then(announcementResponse => {
|
||||
announcements.value = announcementResponse;
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
refresh();
|
||||
|
||||
const headerActions = computed(() => [{
|
||||
asFullButton: true,
|
||||
icon: 'ti ti-plus',
|
||||
text: i18n.ts.add,
|
||||
handler: add,
|
||||
disabled: announcementsStatus.value === 'archived',
|
||||
}]);
|
||||
|
||||
const headerTabs = computed(() => []);
|
||||
|
|
|
|||
|
|
@ -80,9 +80,9 @@ const pagination = {
|
|||
sort: sort.value,
|
||||
host: host.value !== '' ? host.value : null,
|
||||
...(
|
||||
state.value === 'federating' ? { federating: true } :
|
||||
state.value === 'subscribing' ? { subscribing: true } :
|
||||
state.value === 'publishing' ? { publishing: true } :
|
||||
state.value === 'federating' ? { federating: true, suspended: false, blocked: false } :
|
||||
state.value === 'subscribing' ? { subscribing: true, suspended: false, blocked: false } :
|
||||
state.value === 'publishing' ? { publishing: true, suspended: false, blocked: false } :
|
||||
state.value === 'suspended' ? { suspended: true } :
|
||||
state.value === 'blocked' ? { blocked: true } :
|
||||
state.value === 'silenced' ? { silenced: true } :
|
||||
|
|
|
|||
|
|
@ -8,14 +8,22 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template #header><XHeader v-model:tab="tab" :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
<MkSpacer :contentMax="700" :marginMin="16" :marginMax="32">
|
||||
<FormSuspense :p="init">
|
||||
<MkTextarea v-if="tab === 'block'" v-model="blockedHosts">
|
||||
<span>{{ i18n.ts.blockedInstances }}</span>
|
||||
<template #caption>{{ i18n.ts.blockedInstancesDescription }}</template>
|
||||
</MkTextarea>
|
||||
<MkTextarea v-else-if="tab === 'silence'" v-model="silencedHosts" class="_formBlock">
|
||||
<span>{{ i18n.ts.silencedInstances }}</span>
|
||||
<template #caption>{{ i18n.ts.silencedInstancesDescription }}</template>
|
||||
</MkTextarea>
|
||||
<template v-if="tab === 'block'">
|
||||
<MkTextarea v-model="blockedHosts">
|
||||
<span>{{ i18n.ts.blockedInstances }}</span>
|
||||
<template #caption>{{ i18n.ts.blockedInstancesDescription }}</template>
|
||||
</MkTextarea>
|
||||
</template>
|
||||
<template v-else-if="tab === 'silence'">
|
||||
<MkTextarea v-model="silencedHosts" class="_formBlock">
|
||||
<span>{{ i18n.ts.silencedInstances }}</span>
|
||||
<template #caption>{{ i18n.ts.silencedInstancesDescription }}</template>
|
||||
</MkTextarea>
|
||||
<MkTextarea v-model="mediaSilencedHosts" class="_formBlock">
|
||||
<span>{{ i18n.ts.mediaSilencedInstances }}</span>
|
||||
<template #caption>{{ i18n.ts.mediaSilencedInstancesDescription }}</template>
|
||||
</MkTextarea>
|
||||
</template>
|
||||
<MkButton primary @click="save"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
|
||||
</FormSuspense>
|
||||
</MkSpacer>
|
||||
|
|
@ -36,18 +44,21 @@ import { definePageMetadata } from '@/scripts/page-metadata.js';
|
|||
|
||||
const blockedHosts = ref<string>('');
|
||||
const silencedHosts = ref<string>('');
|
||||
const mediaSilencedHosts = ref<string>('');
|
||||
const tab = ref('block');
|
||||
|
||||
async function init() {
|
||||
const meta = await misskeyApi('admin/meta');
|
||||
blockedHosts.value = meta.blockedHosts.join('\n');
|
||||
silencedHosts.value = meta.silencedHosts.join('\n');
|
||||
mediaSilencedHosts.value = meta.mediaSilencedHosts.join('\n');
|
||||
}
|
||||
|
||||
function save() {
|
||||
os.apiWithDialog('admin/update-meta', {
|
||||
blockedHosts: blockedHosts.value.split('\n') || [],
|
||||
silencedHosts: silencedHosts.value.split('\n') || [],
|
||||
mediaSilencedHosts: mediaSilencedHosts.value.split('\n') || [],
|
||||
|
||||
}).then(() => {
|
||||
fetchInstance(true);
|
||||
|
|
|
|||
|
|
@ -37,11 +37,17 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<button class="_button" :class="$style.fileAltEditBtn" @click="describe()">
|
||||
<div class="_gaps_s">
|
||||
<button class="_button" :class="$style.kvEditBtn" @click="move()">
|
||||
<MkKeyValue>
|
||||
<template #key>{{ i18n.ts.folder }}</template>
|
||||
<template #value>{{ folderHierarchy.join(' > ') }}<i class="ti ti-pencil" :class="$style.kvEditIcon"></i></template>
|
||||
</MkKeyValue>
|
||||
</button>
|
||||
<button class="_button" :class="$style.kvEditBtn" @click="describe()">
|
||||
<MkKeyValue>
|
||||
<template #key>{{ i18n.ts.description }}</template>
|
||||
<template #value>{{ file.comment ? file.comment : `(${i18n.ts.none})` }}<i class="ti ti-pencil" :class="$style.fileAltEditIcon"></i></template>
|
||||
<template #value>{{ file.comment ? file.comment : `(${i18n.ts.none})` }}<i class="ti ti-pencil" :class="$style.kvEditIcon"></i></template>
|
||||
</MkKeyValue>
|
||||
</button>
|
||||
<MkKeyValue :class="$style.fileMetaDataChildren">
|
||||
|
|
@ -90,6 +96,18 @@ const props = defineProps<{
|
|||
|
||||
const fetching = ref(true);
|
||||
const file = ref<Misskey.entities.DriveFile>();
|
||||
const folderHierarchy = computed(() => {
|
||||
if (!file.value) return [i18n.ts.drive];
|
||||
const folderNames = [i18n.ts.drive];
|
||||
|
||||
function get(folder: Misskey.entities.DriveFolder) {
|
||||
if (folder.parent) get(folder.parent);
|
||||
folderNames.push(folder.name);
|
||||
}
|
||||
|
||||
if (file.value.folder) get(file.value.folder);
|
||||
return folderNames;
|
||||
});
|
||||
const isImage = computed(() => file.value?.type.startsWith('image/'));
|
||||
|
||||
async function fetch() {
|
||||
|
|
@ -122,6 +140,19 @@ function crop() {
|
|||
});
|
||||
}
|
||||
|
||||
function move() {
|
||||
if (!file.value) return;
|
||||
|
||||
os.selectDriveFolder(false).then(folder => {
|
||||
misskeyApi('drive/files/update', {
|
||||
fileId: file.value.id,
|
||||
folderId: folder[0] ? folder[0].id : null,
|
||||
}).then(async () => {
|
||||
await fetch();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function toggleSensitive() {
|
||||
if (!file.value) return;
|
||||
|
||||
|
|
@ -282,14 +313,14 @@ onMounted(async () => {
|
|||
padding: .5rem 1rem;
|
||||
}
|
||||
|
||||
.fileAltEditBtn {
|
||||
.kvEditBtn {
|
||||
text-align: start;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: .5rem 1rem;
|
||||
border-radius: var(--radius);
|
||||
|
||||
.fileAltEditIcon {
|
||||
.kvEditIcon {
|
||||
display: inline-block;
|
||||
color: transparent;
|
||||
visibility: hidden;
|
||||
|
|
@ -300,7 +331,7 @@ onMounted(async () => {
|
|||
color: var(--accent);
|
||||
background-color: var(--accentedBg);
|
||||
|
||||
.fileAltEditIcon {
|
||||
.kvEditIcon {
|
||||
color: var(--accent);
|
||||
visibility: visible;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,8 +15,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template v-if="emoji" #header>:{{ emoji.name }}:</template>
|
||||
<template v-else #header>New emoji</template>
|
||||
|
||||
<div>
|
||||
<MkSpacer :marginMin="20" :marginMax="28">
|
||||
<div style="display: flex; flex-direction: column; min-height: 100%;">
|
||||
<MkSpacer :marginMin="20" :marginMax="28" style="flex-grow: 1;">
|
||||
<div class="_gaps_m">
|
||||
<div v-if="imgUrl != null" :class="$style.imgs">
|
||||
<div style="background: #000;" :class="$style.imgContainer">
|
||||
|
|
@ -239,10 +239,12 @@ async function del() {
|
|||
|
||||
.footer {
|
||||
position: sticky;
|
||||
z-index: 10000;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 12px;
|
||||
border-top: solid 0.5px var(--divider);
|
||||
background: var(--acrylicBg);
|
||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||
backdrop-filter: var(--blur, blur(15px));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -47,6 +47,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkButton v-if="suspensionState !== 'none'" :disabled="!instance" @click="resumeDelivery">{{ i18n.ts._delivery.resume }}</MkButton>
|
||||
<MkSwitch v-model="isBlocked" :disabled="!meta || !instance" @update:modelValue="toggleBlock">{{ i18n.ts.blockThisInstance }}</MkSwitch>
|
||||
<MkSwitch v-model="isSilenced" :disabled="!meta || !instance" @update:modelValue="toggleSilenced">{{ i18n.ts.silenceThisInstance }}</MkSwitch>
|
||||
<MkSwitch v-model="isMediaSilenced" :disabled="!meta || !instance" @update:modelValue="toggleMediaSilenced">{{ i18n.ts.mediaSilenceThisInstance }}</MkSwitch>
|
||||
<MkButton @click="refreshMetadata"><i class="ti ti-refresh"></i> Refresh metadata</MkButton>
|
||||
<MkTextarea v-model="moderationNote" manualSave>
|
||||
<template #label>{{ i18n.ts.moderationNote }}</template>
|
||||
|
|
@ -167,6 +168,7 @@ const instance = ref<Misskey.entities.FederationInstance | null>(null);
|
|||
const suspensionState = ref<'none' | 'manuallySuspended' | 'goneSuspended' | 'autoSuspendedForNotResponding'>('none');
|
||||
const isBlocked = ref(false);
|
||||
const isSilenced = ref(false);
|
||||
const isMediaSilenced = ref(false);
|
||||
const faviconUrl = ref<string | null>(null);
|
||||
const moderationNote = ref('');
|
||||
|
||||
|
|
@ -195,8 +197,9 @@ async function fetch(): Promise<void> {
|
|||
suspensionState.value = instance.value?.suspensionState ?? 'none';
|
||||
isBlocked.value = instance.value?.isBlocked ?? false;
|
||||
isSilenced.value = instance.value?.isSilenced ?? false;
|
||||
isMediaSilenced.value = instance.value?.isMediaSilenced ?? false;
|
||||
faviconUrl.value = getProxiedImageUrlNullable(instance.value?.faviconUrl, 'preview') ?? getProxiedImageUrlNullable(instance.value?.iconUrl, 'preview');
|
||||
moderationNote.value = instance.value?.moderationNote;
|
||||
moderationNote.value = instance.value?.moderationNote ?? '';
|
||||
}
|
||||
|
||||
async function toggleBlock(): Promise<void> {
|
||||
|
|
@ -218,6 +221,16 @@ async function toggleSilenced(): Promise<void> {
|
|||
});
|
||||
}
|
||||
|
||||
async function toggleMediaSilenced(): Promise<void> {
|
||||
if (!meta.value) throw new Error('No meta?');
|
||||
if (!instance.value) throw new Error('No instance?');
|
||||
const { host } = instance.value;
|
||||
const mediaSilencedHosts = meta.value.mediaSilencedHosts ?? [];
|
||||
await misskeyApi('admin/update-meta', {
|
||||
mediaSilencedHosts: isMediaSilenced.value ? mediaSilencedHosts.concat([host]) : mediaSilencedHosts.filter(x => x !== host),
|
||||
});
|
||||
}
|
||||
|
||||
async function stopDelivery(): Promise<void> {
|
||||
if (!instance.value) throw new Error('No instance?');
|
||||
suspensionState.value = 'manuallySuspended';
|
||||
|
|
|
|||
|
|
@ -4,43 +4,33 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
-->
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<XAntenna :antenna="draft" @created="onAntennaCreated"/>
|
||||
</div>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
|
||||
<MkAntennaEditor @created="onAntennaCreated"/>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import XAntenna from './editor.vue';
|
||||
import { computed } from 'vue';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||
import { antennasCache } from '@/cache.js';
|
||||
import { useRouter } from '@/router/supplier.js';
|
||||
import MkAntennaEditor from '@/components/MkAntennaEditor.vue';
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const draft = ref({
|
||||
name: '',
|
||||
src: 'all',
|
||||
userListId: null,
|
||||
users: [],
|
||||
keywords: [],
|
||||
excludeKeywords: [],
|
||||
excludeBots: false,
|
||||
withReplies: false,
|
||||
caseSensitive: false,
|
||||
localOnly: false,
|
||||
withFile: false,
|
||||
notify: false,
|
||||
});
|
||||
|
||||
function onAntennaCreated() {
|
||||
antennasCache.delete();
|
||||
router.push('/my/antennas');
|
||||
}
|
||||
|
||||
const headerActions = computed(() => []);
|
||||
const headerTabs = computed(() => []);
|
||||
|
||||
definePageMetadata(() => ({
|
||||
title: i18n.ts.manageAntennas,
|
||||
title: i18n.ts.createAntenna,
|
||||
icon: 'ti ti-antenna',
|
||||
}));
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -4,15 +4,17 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
-->
|
||||
|
||||
<template>
|
||||
<div class="">
|
||||
<XAntenna v-if="antenna" :antenna="antenna" @updated="onAntennaUpdated"/>
|
||||
</div>
|
||||
<MkStickyContainer>
|
||||
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
|
||||
|
||||
<MkAntennaEditor v-if="antenna" :antenna="antenna" @updated="onAntennaUpdated"/>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { ref, computed } from 'vue';
|
||||
import * as Misskey from 'misskey-js';
|
||||
import XAntenna from './editor.vue';
|
||||
import MkAntennaEditor from '@/components/MkAntennaEditor.vue';
|
||||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||
|
|
@ -36,8 +38,11 @@ misskeyApi('antennas/show', { antennaId: props.antennaId }).then((antennaRespons
|
|||
antenna.value = antennaResponse;
|
||||
});
|
||||
|
||||
const headerActions = computed(() => []);
|
||||
const headerTabs = computed(() => []);
|
||||
|
||||
definePageMetadata(() => ({
|
||||
title: i18n.ts.manageAntennas,
|
||||
title: i18n.ts.editAntenna,
|
||||
icon: 'ti ti-antenna',
|
||||
}));
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,148 +0,0 @@
|
|||
<!--
|
||||
SPDX-FileCopyrightText: syuilo and misskey-project
|
||||
SPDX-License-Identifier: AGPL-3.0-only
|
||||
-->
|
||||
|
||||
<template>
|
||||
<MkSpacer :contentMax="700">
|
||||
<div>
|
||||
<div class="_gaps_m">
|
||||
<MkInput v-model="name">
|
||||
<template #label>{{ i18n.ts.name }}</template>
|
||||
</MkInput>
|
||||
<MkSelect v-model="src">
|
||||
<template #label>{{ i18n.ts.antennaSource }}</template>
|
||||
<option value="all">{{ i18n.ts._antennaSources.all }}</option>
|
||||
<!--<option value="home">{{ i18n.ts._antennaSources.homeTimeline }}</option>-->
|
||||
<option value="users">{{ i18n.ts._antennaSources.users }}</option>
|
||||
<!--<option value="list">{{ i18n.ts._antennaSources.userList }}</option>-->
|
||||
<option value="users_blacklist">{{ i18n.ts._antennaSources.userBlacklist }}</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-if="src === 'list'" v-model="userListId">
|
||||
<template #label>{{ i18n.ts.userList }}</template>
|
||||
<option v-for="list in userLists" :key="list.id" :value="list.id">{{ list.name }}</option>
|
||||
</MkSelect>
|
||||
<MkTextarea v-else-if="src === 'users' || src === 'users_blacklist'" v-model="users">
|
||||
<template #label>{{ i18n.ts.users }}</template>
|
||||
<template #caption>{{ i18n.ts.antennaUsersDescription }} <button class="_textButton" @click="addUser">{{ i18n.ts.addUser }}</button></template>
|
||||
</MkTextarea>
|
||||
<MkSwitch v-model="excludeBots">{{ i18n.ts.antennaExcludeBots }}</MkSwitch>
|
||||
<MkSwitch v-model="withReplies">{{ i18n.ts.withReplies }}</MkSwitch>
|
||||
<MkTextarea v-model="keywords">
|
||||
<template #label>{{ i18n.ts.antennaKeywords }}</template>
|
||||
<template #caption>{{ i18n.ts.antennaKeywordsDescription }}</template>
|
||||
</MkTextarea>
|
||||
<MkTextarea v-model="excludeKeywords">
|
||||
<template #label>{{ i18n.ts.antennaExcludeKeywords }}</template>
|
||||
<template #caption>{{ i18n.ts.antennaKeywordsDescription }}</template>
|
||||
</MkTextarea>
|
||||
<MkSwitch v-model="localOnly">{{ i18n.ts.localOnly }}</MkSwitch>
|
||||
<MkSwitch v-model="caseSensitive">{{ i18n.ts.caseSensitive }}</MkSwitch>
|
||||
<MkSwitch v-model="withFile">{{ i18n.ts.withFileAntenna }}</MkSwitch>
|
||||
</div>
|
||||
<div :class="$style.actions">
|
||||
<div class="_buttons">
|
||||
<MkButton inline primary @click="saveAntenna()"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
|
||||
<MkButton v-if="antenna.id != null" inline danger @click="deleteAntenna()"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { watch, ref } from 'vue';
|
||||
import * as Misskey from 'misskey-js';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
import MkInput from '@/components/MkInput.vue';
|
||||
import MkTextarea from '@/components/MkTextarea.vue';
|
||||
import MkSelect from '@/components/MkSelect.vue';
|
||||
import MkSwitch from '@/components/MkSwitch.vue';
|
||||
import * as os from '@/os.js';
|
||||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
|
||||
const props = defineProps<{
|
||||
antenna: Misskey.entities.Antenna
|
||||
}>();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(ev: 'created'): void,
|
||||
(ev: 'updated'): void,
|
||||
(ev: 'deleted'): void,
|
||||
}>();
|
||||
|
||||
const name = ref<string>(props.antenna.name);
|
||||
const src = ref<Misskey.entities.AntennasCreateRequest['src']>(props.antenna.src);
|
||||
const userListId = ref<string | null>(props.antenna.userListId);
|
||||
const users = ref<string>(props.antenna.users.join('\n'));
|
||||
const keywords = ref<string>(props.antenna.keywords.map(x => x.join(' ')).join('\n'));
|
||||
const excludeKeywords = ref<string>(props.antenna.excludeKeywords.map(x => x.join(' ')).join('\n'));
|
||||
const caseSensitive = ref<boolean>(props.antenna.caseSensitive);
|
||||
const localOnly = ref<boolean>(props.antenna.localOnly);
|
||||
const excludeBots = ref<boolean>(props.antenna.excludeBots);
|
||||
const withReplies = ref<boolean>(props.antenna.withReplies);
|
||||
const withFile = ref<boolean>(props.antenna.withFile);
|
||||
const userLists = ref<Misskey.entities.UserList[] | null>(null);
|
||||
|
||||
watch(() => src.value, async () => {
|
||||
if (src.value === 'list' && userLists.value === null) {
|
||||
userLists.value = await misskeyApi('users/lists/list');
|
||||
}
|
||||
});
|
||||
|
||||
async function saveAntenna() {
|
||||
const antennaData = {
|
||||
name: name.value,
|
||||
src: src.value,
|
||||
userListId: userListId.value,
|
||||
excludeBots: excludeBots.value,
|
||||
withReplies: withReplies.value,
|
||||
withFile: withFile.value,
|
||||
caseSensitive: caseSensitive.value,
|
||||
localOnly: localOnly.value,
|
||||
users: users.value.trim().split('\n').map(x => x.trim()),
|
||||
keywords: keywords.value.trim().split('\n').map(x => x.trim().split(' ')),
|
||||
excludeKeywords: excludeKeywords.value.trim().split('\n').map(x => x.trim().split(' ')),
|
||||
};
|
||||
|
||||
if (props.antenna.id == null) {
|
||||
await os.apiWithDialog('antennas/create', antennaData);
|
||||
emit('created');
|
||||
} else {
|
||||
await os.apiWithDialog('antennas/update', { ...antennaData, antennaId: props.antenna.id });
|
||||
emit('updated');
|
||||
}
|
||||
}
|
||||
|
||||
async function deleteAntenna() {
|
||||
const { canceled } = await os.confirm({
|
||||
type: 'warning',
|
||||
text: i18n.tsx.removeAreYouSure({ x: props.antenna.name }),
|
||||
});
|
||||
if (canceled) return;
|
||||
|
||||
await misskeyApi('antennas/delete', {
|
||||
antennaId: props.antenna.id,
|
||||
});
|
||||
|
||||
os.success();
|
||||
emit('deleted');
|
||||
}
|
||||
|
||||
function addUser() {
|
||||
os.selectUser({ includeSelf: true }).then(user => {
|
||||
users.value = users.value.trim();
|
||||
users.value += '\n@' + Misskey.acct.toString(user as any);
|
||||
users.value = users.value.trim();
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.actions {
|
||||
margin-top: 16px;
|
||||
padding: 24px 0;
|
||||
border-top: solid 0.5px var(--divider);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkButton primary rounded class="add" @click="create"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton>
|
||||
|
||||
<MkPagination v-slot="{ items }" ref="pagingComponent" :pagination="pagination" class="_gaps">
|
||||
<MkClipPreview v-for="item in items" :key="item.id" :clip="item"/>
|
||||
<MkClipPreview v-for="item in items" :key="item.id" :clip="item" :noUserInfo="true"/>
|
||||
</MkPagination>
|
||||
</div>
|
||||
<div v-else-if="tab === 'favorites'" key="favorites" class="_gaps">
|
||||
|
|
|
|||
|
|
@ -133,22 +133,25 @@ async function removeUser(item, ev) {
|
|||
}
|
||||
|
||||
async function showMembershipMenu(item, ev) {
|
||||
const withRepliesRef = ref(item.withReplies);
|
||||
os.popupMenu([{
|
||||
text: item.withReplies ? i18n.ts.hideRepliesToOthersInTimeline : i18n.ts.showRepliesToOthersInTimeline,
|
||||
icon: item.withReplies ? 'ti ti-messages-off' : 'ti ti-messages',
|
||||
action: async () => {
|
||||
misskeyApi('users/lists/update-membership', {
|
||||
listId: list.value.id,
|
||||
userId: item.userId,
|
||||
withReplies: !item.withReplies,
|
||||
}).then(() => {
|
||||
paginationEl.value.updateItem(item.id, (old) => ({
|
||||
...old,
|
||||
withReplies: !item.withReplies,
|
||||
}));
|
||||
});
|
||||
},
|
||||
type: 'switch',
|
||||
text: i18n.ts.showRepliesToOthersInTimeline,
|
||||
icon: 'ti ti-messages',
|
||||
ref: withRepliesRef,
|
||||
}], ev.currentTarget ?? ev.target);
|
||||
watch(withRepliesRef, withReplies => {
|
||||
misskeyApi('users/lists/update-membership', {
|
||||
listId: list.value!.id,
|
||||
userId: item.userId,
|
||||
withReplies,
|
||||
}).then(() => {
|
||||
paginationEl.value!.updateItem(item.id, (old) => ({
|
||||
...old,
|
||||
withReplies,
|
||||
}));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async function deleteList() {
|
||||
|
|
|
|||
|
|
@ -6,29 +6,38 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template>
|
||||
<div class="_gaps">
|
||||
<div class="_gaps">
|
||||
<MkInput v-model="searchQuery" :large="true" :autofocus="true" type="search" @enter="search">
|
||||
<MkInput v-model="searchQuery" :large="true" :autofocus="true" type="search" @enter.prevent="search">
|
||||
<template #prefix><i class="ti ti-search"></i></template>
|
||||
</MkInput>
|
||||
<MkFolder>
|
||||
<template #label>{{ i18n.ts.options }}</template>
|
||||
<MkFoldableSection :expanded="true">
|
||||
<template #header>{{ i18n.ts.options }}</template>
|
||||
|
||||
<div class="_gaps_m">
|
||||
<MkSwitch v-model="isLocalOnly">{{ i18n.ts.localOnly }}</MkSwitch>
|
||||
<MkRadios v-model="hostSelect">
|
||||
<template #label>{{ i18n.ts.host }}</template>
|
||||
<option value="all" default>{{ i18n.ts.all }}</option>
|
||||
<option value="local">{{ i18n.ts.local }}</option>
|
||||
<option v-if="noteSearchableScope === 'global'" value="specified">{{ i18n.ts.specifyHost }}</option>
|
||||
</MkRadios>
|
||||
<MkInput v-if="noteSearchableScope === 'global'" v-model="hostInput" :disabled="hostSelect !== 'specified'" :large="true" type="search">
|
||||
<template #prefix><i class="ti ti-server"></i></template>
|
||||
</MkInput>
|
||||
|
||||
<MkFolder :defaultOpen="true">
|
||||
<template #label>{{ i18n.ts.specifyUser }}</template>
|
||||
<template v-if="user" #suffix>@{{ user.username }}</template>
|
||||
<template v-if="user" #suffix>@{{ user.username }}{{ user.host ? `@${user.host}` : "" }}</template>
|
||||
|
||||
<div style="text-align: center;" class="_gaps">
|
||||
<div v-if="user">@{{ user.username }}</div>
|
||||
<div>
|
||||
<MkButton v-if="user == null" primary rounded inline @click="selectUser">{{ i18n.ts.selectUser }}</MkButton>
|
||||
<MkButton v-else danger rounded inline @click="user = null">{{ i18n.ts.remove }}</MkButton>
|
||||
<div class="_gaps">
|
||||
<div :class="$style.userItem">
|
||||
<MkUserCardMini v-if="user" :class="$style.userCard" :user="user" :withChart="false"/>
|
||||
<MkButton v-if="user == null && $i != null" transparent :class="$style.addMeButton" @click="selectSelf"><div :class="$style.addUserButtonInner"><span><i class="ti ti-plus"></i><i class="ti ti-user"></i></span><span>{{ i18n.ts.selectSelf }}</span></div></MkButton>
|
||||
<MkButton v-if="user == null" transparent :class="$style.addUserButton" @click="selectUser"><div :class="$style.addUserButtonInner"><i class="ti ti-plus"></i><span>{{ i18n.ts.selectUser }}</span></div></MkButton>
|
||||
<button class="_button" :class="$style.remove" :disabled="user == null" @click="removeUser"><i class="ti ti-x"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</MkFolder>
|
||||
</div>
|
||||
</MkFolder>
|
||||
</MkFoldableSection>
|
||||
<div>
|
||||
<MkButton large primary gradate rounded style="margin: 0 auto;" @click="search">{{ i18n.ts.search }}</MkButton>
|
||||
</div>
|
||||
|
|
@ -42,31 +51,90 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { computed, ref, toRef, watch } from 'vue';
|
||||
import type { UserDetailed } from 'misskey-js/entities.js';
|
||||
import type { Paging } from '@/components/MkPagination.vue';
|
||||
import MkNotes from '@/components/MkNotes.vue';
|
||||
import MkInput from '@/components/MkInput.vue';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
import MkSwitch from '@/components/MkSwitch.vue';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import * as os from '@/os.js';
|
||||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
import MkFoldableSection from '@/components/MkFoldableSection.vue';
|
||||
import MkFolder from '@/components/MkFolder.vue';
|
||||
import { useRouter } from '@/router/supplier.js';
|
||||
import MkUserCardMini from '@/components/MkUserCardMini.vue';
|
||||
import MkRadios from '@/components/MkRadios.vue';
|
||||
import { $i } from '@/account.js';
|
||||
import { instance } from '@/instance.js';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
query?: string;
|
||||
userId?: string;
|
||||
username?: string;
|
||||
host?: string | null;
|
||||
}>(), {
|
||||
query: '',
|
||||
userId: undefined,
|
||||
username: undefined,
|
||||
host: '',
|
||||
});
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const key = ref(0);
|
||||
const searchQuery = ref('');
|
||||
const searchOrigin = ref('combined');
|
||||
const notePagination = ref();
|
||||
const user = ref<any>(null);
|
||||
const isLocalOnly = ref(false);
|
||||
const searchQuery = ref(toRef(props, 'query').value);
|
||||
const notePagination = ref<Paging>();
|
||||
const user = ref<UserDetailed | null>(null);
|
||||
const hostInput = ref(toRef(props, 'host').value);
|
||||
|
||||
function selectUser() {
|
||||
os.selectUser({ includeSelf: true }).then(_user => {
|
||||
const noteSearchableScope = instance.noteSearchableScope ?? 'local';
|
||||
|
||||
const hostSelect = ref<'all' | 'local' | 'specified'>('all');
|
||||
|
||||
const setHostSelectWithInput = (after:string|undefined|null, before:string|undefined|null) => {
|
||||
if (before === after) return;
|
||||
if (after === '') hostSelect.value = 'all';
|
||||
else hostSelect.value = 'specified';
|
||||
};
|
||||
|
||||
setHostSelectWithInput(hostInput.value, undefined);
|
||||
|
||||
watch(hostInput, setHostSelectWithInput);
|
||||
|
||||
const searchHost = computed(() => {
|
||||
if (hostSelect.value === 'local') return '.';
|
||||
if (hostSelect.value === 'specified') return hostInput.value;
|
||||
return null;
|
||||
});
|
||||
|
||||
if (props.userId != null) {
|
||||
misskeyApi('users/show', { userId: props.userId }).then(_user => {
|
||||
user.value = _user;
|
||||
});
|
||||
} else if (props.username != null) {
|
||||
misskeyApi('users/show', {
|
||||
username: props.username,
|
||||
...(props.host != null && props.host !== '') ? { host: props.host } : {},
|
||||
}).then(_user => {
|
||||
user.value = _user;
|
||||
});
|
||||
}
|
||||
|
||||
function selectUser() {
|
||||
os.selectUser({ includeSelf: true, localOnly: instance.noteSearchableScope === 'local' }).then(_user => {
|
||||
user.value = _user;
|
||||
hostInput.value = _user.host ?? '';
|
||||
});
|
||||
}
|
||||
|
||||
function selectSelf() {
|
||||
user.value = $i as UserDetailed | null;
|
||||
hostInput.value = null;
|
||||
}
|
||||
|
||||
function removeUser() {
|
||||
user.value = null;
|
||||
hostInput.value = '';
|
||||
}
|
||||
|
||||
async function search() {
|
||||
|
|
@ -74,22 +142,54 @@ async function search() {
|
|||
|
||||
if (query == null || query === '') return;
|
||||
|
||||
if (query.startsWith('https://')) {
|
||||
const promise = misskeyApi('ap/show', {
|
||||
uri: query,
|
||||
//#region AP lookup
|
||||
if (query.startsWith('https://') && !query.includes(' ')) {
|
||||
const confirm = await os.confirm({
|
||||
type: 'info',
|
||||
text: i18n.ts.lookupConfirm,
|
||||
});
|
||||
if (!confirm.canceled) {
|
||||
const promise = misskeyApi('ap/show', {
|
||||
uri: query,
|
||||
});
|
||||
|
||||
os.promiseDialog(promise, null, null, i18n.ts.fetchingAsApObject);
|
||||
os.promiseDialog(promise, null, null, i18n.ts.fetchingAsApObject);
|
||||
|
||||
const res = await promise;
|
||||
const res = await promise;
|
||||
|
||||
if (res.type === 'User') {
|
||||
router.push(`/@${res.object.username}@${res.object.host}`);
|
||||
} else if (res.type === 'Note') {
|
||||
router.push(`/notes/${res.object.id}`);
|
||||
if (res.type === 'User') {
|
||||
router.push(`/@${res.object.username}@${res.object.host}`);
|
||||
} else if (res.type === 'Note') {
|
||||
router.push(`/notes/${res.object.id}`);
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
//#endregion
|
||||
|
||||
if (query.length > 1 && !query.includes(' ')) {
|
||||
if (query.startsWith('@')) {
|
||||
const confirm = await os.confirm({
|
||||
type: 'info',
|
||||
text: i18n.ts.lookupConfirm,
|
||||
});
|
||||
if (!confirm.canceled) {
|
||||
router.push(`/${query}`);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
return;
|
||||
if (query.startsWith('#')) {
|
||||
const confirm = await os.confirm({
|
||||
type: 'info',
|
||||
text: i18n.ts.openTagPageConfirm,
|
||||
});
|
||||
if (!confirm.canceled) {
|
||||
router.push(`/tags/${encodeURIComponent(query.substring(1))}`);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
notePagination.value = {
|
||||
|
|
@ -98,11 +198,49 @@ async function search() {
|
|||
params: {
|
||||
query: searchQuery.value,
|
||||
userId: user.value ? user.value.id : null,
|
||||
...(searchHost.value ? { host: searchHost.value } : {}),
|
||||
},
|
||||
};
|
||||
|
||||
if (isLocalOnly.value) notePagination.value.params.host = '.';
|
||||
|
||||
key.value++;
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" module>
|
||||
.userItem {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.addMeButton {
|
||||
border: 2px dashed var(--fgTransparent);
|
||||
padding: 12px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
.addUserButton {
|
||||
border: 2px dashed var(--fgTransparent);
|
||||
padding: 12px;
|
||||
flex-grow: 1;
|
||||
}
|
||||
.addUserButtonInner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
min-height: 38px;
|
||||
}
|
||||
.userCard {
|
||||
flex-grow: 1;
|
||||
}
|
||||
.remove {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
align-self: center;
|
||||
|
||||
& > i:before {
|
||||
color: #ff2a2a;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
88
packages/frontend/src/pages/search.stories.impl.ts
Normal file
88
packages/frontend/src/pages/search.stories.impl.ts
Normal file
|
|
@ -0,0 +1,88 @@
|
|||
/*
|
||||
* SPDX-FileCopyrightText: syuilo and misskey-project
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
*/
|
||||
|
||||
import { StoryObj } from '@storybook/vue3';
|
||||
import { HttpResponse, http } from 'msw';
|
||||
import search_ from './search.vue';
|
||||
import { userDetailed } from '@/../.storybook/fakes.js';
|
||||
import { commonHandlers } from '@/../.storybook/mocks.js';
|
||||
|
||||
const localUser = userDetailed('someuserid', 'miskist', null, 'Local Misskey User');
|
||||
|
||||
export const Default = {
|
||||
render(args) {
|
||||
return {
|
||||
components: {
|
||||
search_,
|
||||
},
|
||||
setup() {
|
||||
return {
|
||||
args,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
props() {
|
||||
return {
|
||||
...this.args,
|
||||
};
|
||||
},
|
||||
},
|
||||
template: '<search_ v-bind="props" />',
|
||||
};
|
||||
},
|
||||
args: {
|
||||
ignoreNotesSearchAvailable: true,
|
||||
},
|
||||
parameters: {
|
||||
layout: 'fullscreen',
|
||||
msw: {
|
||||
handlers: [
|
||||
...commonHandlers,
|
||||
http.post('/api/users/show', () => {
|
||||
return HttpResponse.json(userDetailed());
|
||||
}),
|
||||
http.post('/api/users/search', () => {
|
||||
return HttpResponse.json([userDetailed(), localUser]);
|
||||
}),
|
||||
],
|
||||
},
|
||||
},
|
||||
} satisfies StoryObj<typeof search_>;
|
||||
|
||||
export const NoteSearchDisabled = {
|
||||
...Default,
|
||||
args: {},
|
||||
} satisfies StoryObj<typeof search_>;
|
||||
|
||||
export const WithUsernameLocal = {
|
||||
...Default,
|
||||
|
||||
args: {
|
||||
...Default.args,
|
||||
username: localUser.username,
|
||||
host: localUser.host,
|
||||
},
|
||||
parameters: {
|
||||
layout: 'fullscreen',
|
||||
msw: {
|
||||
handlers: [
|
||||
...commonHandlers,
|
||||
http.post('/api/users/show', () => {
|
||||
return HttpResponse.json(localUser);
|
||||
}),
|
||||
http.post('/api/users/search', () => {
|
||||
return HttpResponse.json([userDetailed(), localUser]);
|
||||
}),
|
||||
],
|
||||
},
|
||||
},
|
||||
} satisfies StoryObj<typeof search_>;
|
||||
|
||||
export const WithUserType = {
|
||||
...Default,
|
||||
args: {
|
||||
type: 'user',
|
||||
},
|
||||
} satisfies StoryObj<typeof search_>;
|
||||
|
|
@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template>
|
||||
<div class="_gaps">
|
||||
<div class="_gaps">
|
||||
<MkInput v-model="searchQuery" :large="true" :autofocus="true" type="search" @enter="search">
|
||||
<MkInput v-model="searchQuery" :large="true" :autofocus="true" type="search" @enter.prevent="search">
|
||||
<template #prefix><i class="ti ti-search"></i></template>
|
||||
</MkInput>
|
||||
<MkRadios v-model="searchOrigin" @update:modelValue="search()">
|
||||
|
|
@ -25,7 +25,9 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { ref, toRef } from 'vue';
|
||||
import type { Endpoints } from 'misskey-js';
|
||||
import type { Paging } from '@/components/MkPagination.vue';
|
||||
import MkUserList from '@/components/MkUserList.vue';
|
||||
import MkInput from '@/components/MkInput.vue';
|
||||
import MkRadios from '@/components/MkRadios.vue';
|
||||
|
|
@ -36,34 +38,74 @@ import MkFoldableSection from '@/components/MkFoldableSection.vue';
|
|||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
import { useRouter } from '@/router/supplier.js';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
query?: string,
|
||||
origin?: Endpoints['users/search']['req']['origin'],
|
||||
}>(), {
|
||||
query: '',
|
||||
origin: 'combined',
|
||||
});
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const key = ref('');
|
||||
const searchQuery = ref('');
|
||||
const searchOrigin = ref('combined');
|
||||
const userPagination = ref();
|
||||
const searchQuery = ref(toRef(props, 'query').value);
|
||||
const searchOrigin = ref(toRef(props, 'origin').value);
|
||||
const userPagination = ref<Paging>();
|
||||
|
||||
async function search() {
|
||||
const query = searchQuery.value.toString().trim();
|
||||
|
||||
if (query == null || query === '') return;
|
||||
|
||||
if (query.startsWith('https://')) {
|
||||
const promise = misskeyApi('ap/show', {
|
||||
uri: query,
|
||||
//#region AP lookup
|
||||
if (query.startsWith('https://') && !query.includes(' ')) {
|
||||
const confirm = await os.confirm({
|
||||
type: 'info',
|
||||
text: i18n.ts.lookupConfirm,
|
||||
});
|
||||
if (!confirm.canceled) {
|
||||
const promise = misskeyApi('ap/show', {
|
||||
uri: query,
|
||||
});
|
||||
|
||||
os.promiseDialog(promise, null, null, i18n.ts.fetchingAsApObject);
|
||||
os.promiseDialog(promise, null, null, i18n.ts.fetchingAsApObject);
|
||||
|
||||
const res = await promise;
|
||||
const res = await promise;
|
||||
|
||||
if (res.type === 'User') {
|
||||
router.push(`/@${res.object.username}@${res.object.host}`);
|
||||
} else if (res.type === 'Note') {
|
||||
router.push(`/notes/${res.object.id}`);
|
||||
if (res.type === 'User') {
|
||||
router.push(`/@${res.object.username}@${res.object.host}`);
|
||||
} else if (res.type === 'Note') {
|
||||
router.push(`/notes/${res.object.id}`);
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
}
|
||||
//#endregion
|
||||
|
||||
if (query.length > 1 && !query.includes(' ')) {
|
||||
if (query.startsWith('@')) {
|
||||
const confirm = await os.confirm({
|
||||
type: 'info',
|
||||
text: i18n.ts.lookupConfirm,
|
||||
});
|
||||
if (!confirm.canceled) {
|
||||
router.push(`/${query}`);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
return;
|
||||
if (query.startsWith('#')) {
|
||||
const confirm = await os.confirm({
|
||||
type: 'info',
|
||||
text: i18n.ts.openTagPageConfirm,
|
||||
});
|
||||
if (!confirm.canceled) {
|
||||
router.push(`/user-tags/${encodeURIComponent(query.substring(1))}`);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
userPagination.value = {
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
|
||||
<MkHorizontalSwipe v-model:tab="tab" :tabs="headerTabs">
|
||||
<MkSpacer v-if="tab === 'note'" key="note" :contentMax="800">
|
||||
<div v-if="notesSearchAvailable">
|
||||
<XNote/>
|
||||
<div v-if="notesSearchAvailable || ignoreNotesSearchAvailable">
|
||||
<XNote v-bind="props"/>
|
||||
</div>
|
||||
<div v-else>
|
||||
<MkInfo warn>{{ i18n.ts.notesSearchNotAvailable }}</MkInfo>
|
||||
|
|
@ -18,27 +18,43 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</MkSpacer>
|
||||
|
||||
<MkSpacer v-else-if="tab === 'user'" key="user" :contentMax="800">
|
||||
<XUser/>
|
||||
<XUser v-bind="props"/>
|
||||
</MkSpacer>
|
||||
</MkHorizontalSwipe>
|
||||
</MkStickyContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, defineAsyncComponent, ref } from 'vue';
|
||||
import { computed, defineAsyncComponent, ref, toRef } from 'vue';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||
import { $i } from '@/account.js';
|
||||
import { instance } from '@/instance.js';
|
||||
import { notesSearchAvailable } from '@/scripts/check-permissions.js';
|
||||
import MkInfo from '@/components/MkInfo.vue';
|
||||
import MkHorizontalSwipe from '@/components/MkHorizontalSwipe.vue';
|
||||
|
||||
const props = withDefaults(defineProps<{
|
||||
query?: string,
|
||||
userId?: string,
|
||||
username?: string,
|
||||
host?: string | null,
|
||||
type?: 'note' | 'user',
|
||||
origin?: 'combined' | 'local' | 'remote',
|
||||
// For storybook only
|
||||
ignoreNotesSearchAvailable?: boolean,
|
||||
}>(), {
|
||||
query: '',
|
||||
userId: undefined,
|
||||
username: undefined,
|
||||
host: undefined,
|
||||
type: 'note',
|
||||
origin: 'combined',
|
||||
ignoreNotesSearchAvailable: false,
|
||||
});
|
||||
|
||||
const XNote = defineAsyncComponent(() => import('./search.note.vue'));
|
||||
const XUser = defineAsyncComponent(() => import('./search.user.vue'));
|
||||
|
||||
const tab = ref('note');
|
||||
|
||||
const notesSearchAvailable = (($i == null && instance.policies.canSearchNotes) || ($i != null && $i.policies.canSearchNotes));
|
||||
const tab = ref(toRef(props, 'type').value);
|
||||
|
||||
const headerActions = computed(() => []);
|
||||
|
||||
|
|
|
|||
|
|
@ -177,6 +177,12 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<option value="dialog">{{ i18n.ts._serverDisconnectedBehavior.dialog }}</option>
|
||||
<option value="quiet">{{ i18n.ts._serverDisconnectedBehavior.quiet }}</option>
|
||||
</MkSelect>
|
||||
<MkSelect v-model="contextMenu">
|
||||
<template #label>{{ i18n.ts._contextMenu.title }}</template>
|
||||
<option value="app">{{ i18n.ts._contextMenu.app }}</option>
|
||||
<option value="appWithShift">{{ i18n.ts._contextMenu.appWithShift }}</option>
|
||||
<option value="native">{{ i18n.ts._contextMenu.native }}</option>
|
||||
</MkSelect>
|
||||
<MkRange v-model="numberOfPageCache" :min="1" :max="10" :step="1" easing>
|
||||
<template #label>{{ i18n.ts.numberOfPageCache }}</template>
|
||||
<template #caption>{{ i18n.ts.numberOfPageCacheDescription }}</template>
|
||||
|
|
@ -317,6 +323,7 @@ const enableHorizontalSwipe = computed(defaultStore.makeGetterSetter('enableHori
|
|||
const useNativeUIForVideoAudioPlayer = computed(defaultStore.makeGetterSetter('useNativeUIForVideoAudioPlayer'));
|
||||
const alwaysConfirmFollow = computed(defaultStore.makeGetterSetter('alwaysConfirmFollow'));
|
||||
const confirmWhenRevealingSensitiveMedia = computed(defaultStore.makeGetterSetter('confirmWhenRevealingSensitiveMedia'));
|
||||
const contextMenu = computed(defaultStore.makeGetterSetter('contextMenu'));
|
||||
|
||||
watch(lang, () => {
|
||||
miLocalStorage.setItem('lang', lang.value as string);
|
||||
|
|
@ -360,6 +367,7 @@ watch([
|
|||
enableSeasonalScreenEffect,
|
||||
alwaysConfirmFollow,
|
||||
confirmWhenRevealingSensitiveMedia,
|
||||
contextMenu,
|
||||
], async () => {
|
||||
await reloadAsk();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -9,7 +9,13 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template #label>{{ i18n.ts.sound }}</template>
|
||||
<option v-for="x in soundsTypes" :key="x ?? 'null'" :value="x">{{ getSoundTypeName(x) }}</option>
|
||||
</MkSelect>
|
||||
<div v-if="type === '_driveFile_'" :class="$style.fileSelectorRoot">
|
||||
<div v-if="type === '_driveFile_' && driveFileError === true" :class="$style.fileSelectorRoot">
|
||||
<MkButton :class="$style.fileSelectorButton" inline rounded primary @click="selectSound">{{ i18n.ts.selectFile }}</MkButton>
|
||||
<div :class="$style.fileErrorRoot">
|
||||
<MkCondensedLine>{{ i18n.ts._soundSettings.driveFileError }}</MkCondensedLine>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="type === '_driveFile_'" :class="$style.fileSelectorRoot">
|
||||
<MkButton :class="$style.fileSelectorButton" inline rounded primary @click="selectSound">{{ i18n.ts.selectFile }}</MkButton>
|
||||
<div :class="['_nowrap', !fileUrl && $style.fileNotSelected]">{{ friendlyFileName }}</div>
|
||||
</div>
|
||||
|
|
@ -19,13 +25,13 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
|
||||
<div class="_buttons">
|
||||
<MkButton inline @click="listen"><i class="ti ti-player-play"></i> {{ i18n.ts.listen }}</MkButton>
|
||||
<MkButton inline primary @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
|
||||
<MkButton inline primary :disabled="!hasChanged || driveFileError" @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed } from 'vue';
|
||||
import { ref, computed, watch } from 'vue';
|
||||
import type { SoundType } from '@/scripts/sound.js';
|
||||
import MkSelect from '@/components/MkSelect.vue';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
|
|
@ -51,13 +57,18 @@ const type = ref<SoundType>(props.type);
|
|||
const fileId = ref(props.fileId);
|
||||
const fileUrl = ref(props.fileUrl);
|
||||
const fileName = ref<string>('');
|
||||
const driveFileError = ref(false);
|
||||
const hasChanged = ref(false);
|
||||
const volume = ref(props.volume);
|
||||
|
||||
if (type.value === '_driveFile_' && fileId.value) {
|
||||
const apiRes = await misskeyApi('drive/files/show', {
|
||||
await misskeyApi('drive/files/show', {
|
||||
fileId: fileId.value,
|
||||
}).then((res) => {
|
||||
fileName.value = res.name;
|
||||
}).catch((res) => {
|
||||
driveFileError.value = true;
|
||||
});
|
||||
fileName.value = apiRes.name;
|
||||
}
|
||||
|
||||
function getSoundTypeName(f: SoundType): string {
|
||||
|
|
@ -107,9 +118,21 @@ function selectSound(ev) {
|
|||
fileUrl.value = file.url;
|
||||
fileName.value = file.name;
|
||||
fileId.value = file.id;
|
||||
driveFileError.value = false;
|
||||
hasChanged.value = true;
|
||||
});
|
||||
}
|
||||
|
||||
watch([type, volume], ([typeTo, volumeTo], [typeFrom, volumeFrom]) => {
|
||||
if (typeFrom !== typeTo && typeTo !== '_driveFile_') {
|
||||
fileUrl.value = undefined;
|
||||
fileName.value = '';
|
||||
fileId.value = undefined;
|
||||
driveFileError.value = false;
|
||||
}
|
||||
hasChanged.value = true;
|
||||
});
|
||||
|
||||
function listen() {
|
||||
if (type.value === '_driveFile_' && (!fileUrl.value || !fileId.value)) {
|
||||
os.alert({
|
||||
|
|
@ -131,6 +154,10 @@ function listen() {
|
|||
}
|
||||
|
||||
function save() {
|
||||
if (hasChanged.value === false || driveFileError.value === true) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (type.value === '_driveFile_' && !fileUrl.value) {
|
||||
os.alert({
|
||||
type: 'warning',
|
||||
|
|
@ -163,6 +190,13 @@ function save() {
|
|||
gap: 8px;
|
||||
}
|
||||
|
||||
.fileErrorRoot {
|
||||
flex-grow: 1;
|
||||
min-width: 0;
|
||||
font-weight: 700;
|
||||
color: var(--error);
|
||||
}
|
||||
|
||||
.fileSelectorButton {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,8 +21,14 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkFolder v-for="type in operationTypes" :key="type">
|
||||
<template #label>{{ i18n.ts._sfx[type] }}</template>
|
||||
<template #suffix>{{ getSoundTypeName(sounds[type].type) }}</template>
|
||||
|
||||
<XSound :type="sounds[type].type" :volume="sounds[type].volume" :fileId="sounds[type].fileId" :fileUrl="sounds[type].fileUrl" @update="(res) => updated(type, res)"/>
|
||||
<Suspense>
|
||||
<template #default>
|
||||
<XSound :type="sounds[type].type" :volume="sounds[type].volume" :fileId="sounds[type].fileId" :fileUrl="sounds[type].fileUrl" @update="(res) => updated(type, res)"/>
|
||||
</template>
|
||||
<template #fallback>
|
||||
<MkLoading/>
|
||||
</template>
|
||||
</Suspense>
|
||||
</MkFolder>
|
||||
</div>
|
||||
</FormSection>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</MkInput>
|
||||
|
||||
<FormSection>
|
||||
<template #label>{{ i18n.ts._webhookSettings.events }}</template>
|
||||
<template #label>{{ i18n.ts._webhookSettings.trigger }}</template>
|
||||
|
||||
<div class="_gaps_s">
|
||||
<MkSwitch v-model="event_follow">{{ i18n.ts._webhookSettings._events.follow }}</MkSwitch>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</MkInput>
|
||||
|
||||
<FormSection>
|
||||
<template #label>{{ i18n.ts._webhookSettings.events }}</template>
|
||||
<template #label>{{ i18n.ts._webhookSettings.trigger }}</template>
|
||||
|
||||
<div class="_gaps_s">
|
||||
<MkSwitch v-model="event_follow">{{ i18n.ts._webhookSettings._events.follow }}</MkSwitch>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkSpacer :contentMax="800">
|
||||
<MkHorizontalSwipe v-model:tab="src" :tabs="$i ? headerTabs : headerTabsWhenNotLogin">
|
||||
<div :key="src" ref="rootEl">
|
||||
<MkInfo v-if="['home', 'local', 'social', 'global'].includes(src) && !defaultStore.reactiveState.timelineTutorials.value[src]" style="margin-bottom: var(--margin);" closable @close="closeTutorial()">
|
||||
<MkInfo v-if="isBasicTimeline(src) && !defaultStore.reactiveState.timelineTutorials.value[src]" style="margin-bottom: var(--margin);" closable @close="closeTutorial()">
|
||||
{{ i18n.ts._timelineDescription[src] }}
|
||||
</MkInfo>
|
||||
<MkPostForm v-if="defaultStore.reactiveState.showFixedPostForm.value" :class="$style.postForm" class="post-form _panel" fixed style="margin-bottom: var(--margin);"/>
|
||||
|
|
@ -45,7 +45,6 @@ import * as os from '@/os.js';
|
|||
import { misskeyApi } from '@/scripts/misskey-api.js';
|
||||
import { defaultStore } from '@/store.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import { instance } from '@/instance.js';
|
||||
import { $i } from '@/account.js';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||
import { antennasCache, userListsCache, favoritedChannelsCache } from '@/cache.js';
|
||||
|
|
@ -53,17 +52,15 @@ import { deviceKind } from '@/scripts/device-kind.js';
|
|||
import { deepMerge } from '@/scripts/merge.js';
|
||||
import { MenuItem } from '@/types/menu.js';
|
||||
import { miLocalStorage } from '@/local-storage.js';
|
||||
import { availableBasicTimelines, hasWithReplies, isAvailableBasicTimeline, isBasicTimeline, basicTimelineIconClass } from '@/timelines.js';
|
||||
|
||||
provide('shouldOmitHeaderTitle', true);
|
||||
|
||||
const isLocalTimelineAvailable = ($i == null && instance.policies.ltlAvailable) || ($i != null && $i.policies.ltlAvailable);
|
||||
const isGlobalTimelineAvailable = ($i == null && instance.policies.gtlAvailable) || ($i != null && $i.policies.gtlAvailable);
|
||||
|
||||
const tlComponent = shallowRef<InstanceType<typeof MkTimeline>>();
|
||||
const rootEl = shallowRef<HTMLElement>();
|
||||
|
||||
const queue = ref(0);
|
||||
const srcWhenNotSignin = ref<'local' | 'global'>(isLocalTimelineAvailable ? 'local' : 'global');
|
||||
const srcWhenNotSignin = ref<'local' | 'global'>(isAvailableBasicTimeline('local') ? 'local' : 'global');
|
||||
const src = computed<'home' | 'local' | 'social' | 'global' | `list:${string}`>({
|
||||
get: () => ($i ? defaultStore.reactiveState.tl.value.src : srcWhenNotSignin.value),
|
||||
set: (x) => saveSrc(x),
|
||||
|
|
@ -74,7 +71,11 @@ const withRenotes = computed<boolean>({
|
|||
});
|
||||
|
||||
// computed内での無限ループを防ぐためのフラグ
|
||||
const localSocialTLFilterSwitchStore = ref<'withReplies' | 'onlyFiles' | false>('withReplies');
|
||||
const localSocialTLFilterSwitchStore = ref<'withReplies' | 'onlyFiles' | false>(
|
||||
defaultStore.reactiveState.tl.value.filter.withReplies ? 'withReplies' :
|
||||
defaultStore.reactiveState.tl.value.filter.onlyFiles ? 'onlyFiles' :
|
||||
false,
|
||||
);
|
||||
|
||||
const withReplies = computed<boolean>({
|
||||
get: () => {
|
||||
|
|
@ -229,7 +230,7 @@ function focus(): void {
|
|||
}
|
||||
|
||||
function closeTutorial(): void {
|
||||
if (!['home', 'local', 'social', 'global'].includes(src.value)) return;
|
||||
if (!isBasicTimeline(src.value)) return;
|
||||
const before = defaultStore.state.timelineTutorials;
|
||||
before[src.value] = true;
|
||||
defaultStore.set('timelineTutorials', before);
|
||||
|
|
@ -245,7 +246,7 @@ const headerActions = computed(() => {
|
|||
type: 'switch',
|
||||
text: i18n.ts.showRenotes,
|
||||
ref: withRenotes,
|
||||
}, src.value === 'local' || src.value === 'social' ? {
|
||||
}, isBasicTimeline(src.value) && hasWithReplies(src.value) ? {
|
||||
type: 'switch',
|
||||
text: i18n.ts.showRepliesToOthersInTimeline,
|
||||
ref: withReplies,
|
||||
|
|
@ -258,7 +259,7 @@ const headerActions = computed(() => {
|
|||
type: 'switch',
|
||||
text: i18n.ts.fileAttachedOnly,
|
||||
ref: onlyFiles,
|
||||
disabled: src.value === 'local' || src.value === 'social' ? withReplies : false,
|
||||
disabled: isBasicTimeline(src.value) && hasWithReplies(src.value) ? withReplies : false,
|
||||
}], ev.currentTarget ?? ev.target);
|
||||
},
|
||||
},
|
||||
|
|
@ -280,27 +281,12 @@ const headerTabs = computed(() => [...(defaultStore.reactiveState.pinnedUserList
|
|||
title: l.name,
|
||||
icon: 'ti ti-star',
|
||||
iconOnly: true,
|
||||
}))), {
|
||||
key: 'home',
|
||||
title: i18n.ts._timelines.home,
|
||||
icon: 'ti ti-home',
|
||||
}))), ...availableBasicTimelines().map(tl => ({
|
||||
key: tl,
|
||||
title: i18n.ts._timelines[tl],
|
||||
icon: basicTimelineIconClass(tl),
|
||||
iconOnly: true,
|
||||
}, ...(isLocalTimelineAvailable ? [{
|
||||
key: 'local',
|
||||
title: i18n.ts._timelines.local,
|
||||
icon: 'ti ti-planet',
|
||||
iconOnly: true,
|
||||
}, {
|
||||
key: 'social',
|
||||
title: i18n.ts._timelines.social,
|
||||
icon: 'ti ti-universe',
|
||||
iconOnly: true,
|
||||
}] : []), ...(isGlobalTimelineAvailable ? [{
|
||||
key: 'global',
|
||||
title: i18n.ts._timelines.global,
|
||||
icon: 'ti ti-whirl',
|
||||
iconOnly: true,
|
||||
}] : []), {
|
||||
})), {
|
||||
icon: 'ti ti-list',
|
||||
title: i18n.ts.lists,
|
||||
iconOnly: true,
|
||||
|
|
@ -317,24 +303,16 @@ const headerTabs = computed(() => [...(defaultStore.reactiveState.pinnedUserList
|
|||
onClick: chooseChannel,
|
||||
}] as Tab[]);
|
||||
|
||||
const headerTabsWhenNotLogin = computed(() => [
|
||||
...(isLocalTimelineAvailable ? [{
|
||||
key: 'local',
|
||||
title: i18n.ts._timelines.local,
|
||||
icon: 'ti ti-planet',
|
||||
iconOnly: true,
|
||||
}] : []),
|
||||
...(isGlobalTimelineAvailable ? [{
|
||||
key: 'global',
|
||||
title: i18n.ts._timelines.global,
|
||||
icon: 'ti ti-whirl',
|
||||
iconOnly: true,
|
||||
}] : []),
|
||||
] as Tab[]);
|
||||
const headerTabsWhenNotLogin = computed(() => [...availableBasicTimelines().map(tl => ({
|
||||
key: tl,
|
||||
title: i18n.ts._timelines[tl],
|
||||
icon: basicTimelineIconClass(tl),
|
||||
iconOnly: true,
|
||||
}))] as Tab[]);
|
||||
|
||||
definePageMetadata(() => ({
|
||||
title: i18n.ts.timeline,
|
||||
icon: src.value === 'local' ? 'ti ti-planet' : src.value === 'social' ? 'ti ti-universe' : src.value === 'global' ? 'ti ti-whirl' : 'ti ti-home',
|
||||
icon: isBasicTimeline(src.value) ? basicTimelineIconClass(src.value) : 'ti ti-home',
|
||||
}));
|
||||
</script>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue