feat: vacation mode & hide counters

This commit is contained in:
무라쿠모 2024-08-28 00:23:50 +09:00
parent c2a7ae59e8
commit fa0e7f6413
No known key found for this signature in database
GPG key ID: 139D6573F92DA9F7
19 changed files with 314 additions and 95 deletions

View file

@ -24,8 +24,8 @@ const accountData = miLocalStorage.getItem('account');
// TODO: 外部からはreadonlyに
export const $i = accountData ? reactive(JSON.parse(accountData) as Account) : null;
export const iAmModerator = $i != null && ($i.isAdmin === true || $i.isModerator === true) && $i.twoFactorEnabled;
export const iAmAdmin = $i != null && $i.isAdmin && $i.twoFactorEnabled;
export const iAmModerator = $i != null && ($i.isAdmin === true || $i.isModerator === true) && $i.twoFactorEnabled && !$i.isVacation;
export const iAmAdmin = $i != null && $i.isAdmin && $i.twoFactorEnabled && !$i.isVacation;
export function signinRequired() {
if ($i == null) throw new Error('signin required');

View file

@ -216,53 +216,6 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
</FormSection>
<FormSection>
<template #label>{{ i18n.ts.hideSensitiveInformation }}</template>
<div class="_gaps_m">
<MkSwitch v-model="privateMode">
{{ i18n.ts._hideSensitiveInformation.use }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.about }}</template>
</MkSwitch>
<MkFolder v-if="privateMode">
<template #label>{{ i18n.ts._hideSensitiveInformation.directMessages }}</template>
<template v-if="hideDirectMessages" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideDirectMessages">
{{ i18n.ts._hideSensitiveInformation.directMessagesUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.directMessagesDescription }}</template>
</MkSwitch>
</MkFolder>
<MkFolder v-if="privateMode">
<template #label>{{ i18n.ts._hideSensitiveInformation.drive }}</template>
<template v-if="hideDriveFileList" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideDriveFileList">
{{ i18n.ts._hideSensitiveInformation.driveUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.driveDescription }}</template>
</MkSwitch>
</MkFolder>
<MkFolder v-if="privateMode && iAmModerator">
<template #label>{{ i18n.ts._hideSensitiveInformation.moderationLog }}</template>
<template v-if="hideModerationLog" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideModerationLog">
{{ i18n.ts._hideSensitiveInformation.moderationLogUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.moderationLogDescription }}</template>
</MkSwitch>
</MkFolder>
<MkFolder v-if="privateMode && iAmModerator">
<template #label>{{ i18n.ts._hideSensitiveInformation.roles }}</template>
<template v-if="hideRoleList" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideRoleList">
{{ i18n.ts._hideSensitiveInformation.rolesUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.rolesDescription }}</template>
</MkSwitch>
</MkFolder>
</div>
</FormSection>
<FormSection>
<template #label>{{ i18n.ts.other }}</template>
@ -370,11 +323,6 @@ const enableHorizontalSwipe = computed(defaultStore.makeGetterSetter('enableHori
const useNativeUIForVideoAudioPlayer = computed(defaultStore.makeGetterSetter('useNativeUIForVideoAudioPlayer'));
const alwaysConfirmFollow = computed(defaultStore.makeGetterSetter('alwaysConfirmFollow'));
const sensitiveDoubleClickRequired = computed(defaultStore.makeGetterSetter('sensitiveDoubleClickRequired'));
const privateMode = computed(defaultStore.makeGetterSetter('privateMode'));
const hideDirectMessages = computed(defaultStore.makeGetterSetter('hideDirectMessages'));
const hideDriveFileList = computed(defaultStore.makeGetterSetter('hideDriveFileList'));
const hideModerationLog = computed(defaultStore.makeGetterSetter('hideModerationLog'));
const hideRoleList = computed(defaultStore.makeGetterSetter('hideRoleList'));
watch(lang, () => {
miLocalStorage.setItem('lang', lang.value as string);
@ -418,11 +366,6 @@ watch([
disableStreamingTimeline,
enableSeasonalScreenEffect,
alwaysConfirmFollow,
privateMode,
hideDirectMessages,
hideDriveFileList,
hideModerationLog,
hideRoleList,
], async () => {
await reloadAsk();
});

View file

@ -163,6 +163,11 @@ const menuDef = computed(() => [{
text: `${i18n.ts.accountMigration}`,
to: '/settings/migration',
active: currentPage.value?.route.name === 'migration',
}, {
icon: 'ti ti-barrier-block',
text: i18n.ts.experimentalFeatures,
to: '/settings/laboratory',
active: currentPage.value?.route.name === 'laboratory',
}, {
icon: 'ti ti-dots',
text: i18n.ts.other,

View file

@ -0,0 +1,203 @@
<!--
SPDX-FileCopyrightText: syuilo and misskey-project
SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
<div class="_gaps_m">
<MkFolder>
<template #icon><i class="ti ti-flask"></i></template>
<template #label>{{ i18n.ts.misskeyExperimentalFeatures }}</template>
<div class="_gaps_m">
<MkSwitch v-model="enableCondensedLineForAcct">
<template #label>Enable condensed line for acct</template>
</MkSwitch>
</div>
</MkFolder>
<FormSection>
<template #label><i class="ti ti-lock-access"></i> {{ i18n.ts.hideSensitiveInformation }}</template>
<template #description>{{ i18n.ts._hideSensitiveInformation.about }}</template>
<div class="_gaps_m">
<MkInfo warn rounded>
{{ i18n.ts.thisIsExperimentalFeature }}
</MkInfo>
<MkSwitch v-model="privateMode">
{{ i18n.ts._hideSensitiveInformation.use }}
</MkSwitch>
<MkFolder v-if="privateMode">
<template #label>{{ i18n.ts._hideSensitiveInformation.directMessages }}</template>
<template v-if="hideDirectMessages" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideDirectMessages">
{{ i18n.ts._hideSensitiveInformation.directMessagesUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.directMessagesDescription }}</template>
</MkSwitch>
</MkFolder>
<MkFolder v-if="privateMode">
<template #label>{{ i18n.ts._hideSensitiveInformation.drive }}</template>
<template v-if="hideDriveFileList" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideDriveFileList">
{{ i18n.ts._hideSensitiveInformation.driveUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.driveDescription }}</template>
</MkSwitch>
</MkFolder>
<MkFolder v-if="privateMode && iAmModerator">
<template #label>{{ i18n.ts._hideSensitiveInformation.moderationLog }}</template>
<template v-if="hideModerationLog" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideModerationLog">
{{ i18n.ts._hideSensitiveInformation.moderationLogUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.moderationLogDescription }}</template>
</MkSwitch>
</MkFolder>
<MkFolder v-if="privateMode && iAmModerator">
<template #label>{{ i18n.ts._hideSensitiveInformation.roles }}</template>
<template v-if="hideRoleList" #suffix>{{ i18n.ts._hideSensitiveInformation.itsHidden }}</template>
<template v-else #suffix>{{ i18n.ts._hideSensitiveInformation.itsNotHidden }}</template>
<MkSwitch v-model="hideRoleList">
{{ i18n.ts._hideSensitiveInformation.rolesUse }}
<template #caption>{{ i18n.ts._hideSensitiveInformation.rolesDescription }}</template>
</MkSwitch>
</MkFolder>
</div>
</FormSection>
<FormSection v-if="$i.isModerator">
<template #label><i class="ti ti-beach"></i> {{ i18n.ts.vacationMode }}</template>
<template #description>{{ i18n.ts.vacationModeDescription }}</template>
<div class="_gaps_m">
<MkInfo warn rounded>
{{ i18n.ts.thisIsExperimentalFeature }}
</MkInfo>
<MkSwitch v-model="isVacation" @update:modelValue="save()">
{{ i18n.ts.useVacationMode }}
</MkSwitch>
</div>
</FormSection>
<FormSection>
<template #label><i class="ti ti-globe-off"></i> {{ i18n.ts.mindControl }}</template>
<template #description></template>
<div class="_gaps_m">
<MkInfo warn rounded>
{{ i18n.ts.thisIsExperimentalFeature }}
</MkInfo>
<MkSwitch v-model="hideCounters">
{{ i18n.ts.hideCounters }}
<template #caption>{{ i18n.ts.hideCountersDescription }}</template>
</MkSwitch>
</div>
</FormSection>
<!--
<MkSelect v-model="followingVisibility" @update:modelValue="save()">
<template #label>{{ i18n.ts.followingVisibility }}</template>
<option value="public">{{ i18n.ts._ffVisibility.public }}</option>
<option value="followers">{{ i18n.ts._ffVisibility.followers }}</option>
<option value="private">{{ i18n.ts._ffVisibility.private }}</option>
</MkSelect>
<MkSelect v-model="followersVisibility" @update:modelValue="save()">
<template #label>{{ i18n.ts.followersVisibility }}</template>
<option value="public">{{ i18n.ts._ffVisibility.public }}</option>
<option value="followers">{{ i18n.ts._ffVisibility.followers }}</option>
<option value="private">{{ i18n.ts._ffVisibility.private }}</option>
</MkSelect>
<MkSwitch v-model="hideOnlineStatus" @update:modelValue="save()">
{{ i18n.ts.hideOnlineStatus }}
<template #caption>{{ i18n.ts.hideOnlineStatusDescription }}</template>
</MkSwitch>
<MkSwitch v-model="noCrawle" @update:modelValue="save()">
{{ i18n.ts.noCrawle }}
<template #caption>{{ i18n.ts.noCrawleDescription }}</template>
</MkSwitch>
<MkSwitch v-model="preventAiLearning" @update:modelValue="save()">
{{ i18n.ts.preventAiLearning }}<span class="_beta">{{ i18n.ts.beta }}</span>
<template #caption>{{ i18n.ts.preventAiLearningDescription }}</template>
</MkSwitch>
<MkSwitch v-model="isExplorable" @update:modelValue="save()">
{{ i18n.ts.makeExplorable }}
<template #caption>{{ i18n.ts.makeExplorableDescription }}</template>
</MkSwitch>
-->
</div>
</template>
<script lang="ts" setup>
import { ref, computed, watch } from 'vue';
import MkSwitch from '@/components/MkSwitch.vue';
// import MkSelect from '@/components/MkSelect.vue';
import FormSection from '@/components/form/section.vue';
import MkFolder from '@/components/MkFolder.vue';
import MkInfo from '@/components/MkInfo.vue';
import { misskeyApi } from '@/scripts/misskey-api.js';
import { i18n } from '@/i18n.js';
import { iAmModerator, signinRequired } from '@/account.js';
import { definePageMetadata } from '@/scripts/page-metadata.js';
import { defaultStore } from "@/store.js";
import * as os from "@/os.js";
import { unisonReload } from "@/scripts/unison-reload.js";
const $i = signinRequired();
const isVacation = ref<boolean | undefined>($i.isVacation !== null ? $i.isVacation : undefined);
const hideCounters = computed(defaultStore.makeGetterSetter('hideCounters'));
const enableCondensedLineForAcct = computed(defaultStore.makeGetterSetter('enableCondensedLineForAcct'));
const privateMode = computed(defaultStore.makeGetterSetter('privateMode'));
const hideDirectMessages = computed(defaultStore.makeGetterSetter('hideDirectMessages'));
const hideDriveFileList = computed(defaultStore.makeGetterSetter('hideDriveFileList'));
const hideModerationLog = computed(defaultStore.makeGetterSetter('hideModerationLog'));
const hideRoleList = computed(defaultStore.makeGetterSetter('hideRoleList'));
function save() {
if (isVacation.value === true) {
defaultStore.set('vacationAlert', true);
}
misskeyApi('i/update', {
isVacation: isVacation.value,
});
}
async function reloadAsk() {
const { canceled } = await os.confirm({
type: 'info',
text: i18n.ts.reloadToApplySetting,
});
if (canceled) return;
unisonReload();
}
watch([
isVacation,
enableCondensedLineForAcct,
privateMode,
hideCounters,
hideDirectMessages,
hideDriveFileList,
hideRoleList,
hideModerationLog,
], async () => {
await reloadAsk();
});
const headerActions = computed(() => []);
const headerTabs = computed(() => []);
definePageMetadata(() => ({
title: i18n.ts.experimentalFeatures,
icon: 'ti ti-barrier-block',
}));
</script>

View file

@ -51,17 +51,6 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
</MkFolder>
<MkFolder>
<template #icon><i class="ti ti-flask"></i></template>
<template #label>{{ i18n.ts.experimentalFeatures }}</template>
<div class="_gaps_m">
<MkSwitch v-model="enableCondensedLineForAcct">
<template #label>Enable condensed line for acct</template>
</MkSwitch>
</div>
</MkFolder>
<MkFolder>
<template #icon><i class="ti ti-code"></i></template>
<template #label>{{ i18n.ts.developer }}</template>
@ -90,7 +79,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { computed, watch } from 'vue';
import { computed } from 'vue';
import MkSwitch from '@/components/MkSwitch.vue';
import FormLink from '@/components/form/link.vue';
import MkFolder from '@/components/MkFolder.vue';
@ -109,7 +98,6 @@ import FormSection from '@/components/form/section.vue';
const $i = signinRequired();
// const reportError = computed(defaultStore.makeGetterSetter('reportError'));
const enableCondensedLineForAcct = computed(defaultStore.makeGetterSetter('enableCondensedLineForAcct'));
const devMode = computed(defaultStore.makeGetterSetter('devMode'));
const defaultWithReplies = computed(defaultStore.makeGetterSetter('defaultWithReplies'));
@ -137,16 +125,6 @@ async function deleteAccount() {
await signout();
}
async function reloadAsk() {
const { canceled } = await os.confirm({
type: 'info',
text: i18n.ts.reloadToApplySetting,
});
if (canceled) return;
unisonReload();
}
async function updateRepliesAll(withReplies: boolean) {
const { canceled } = await os.confirm({
type: 'warning',
@ -157,12 +135,6 @@ async function updateRepliesAll(withReplies: boolean) {
misskeyApi('following/update-all', { withReplies });
}
watch([
enableCondensedLineForAcct,
], async () => {
await reloadAsk();
});
const headerActions = computed(() => []);
const headerTabs = computed(() => []);

View file

@ -168,7 +168,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</dl>
</div>
<div class="status">
<div class="status" v-if="!hideCounters">
<MkA :to="userPage(user)">
<b>{{ number(user.notesCount) }}</b>
<span>{{ i18n.ts.notes }}</span>
@ -207,7 +207,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div v-if="!narrow" class="sub _gaps" style="container-type: inline-size;">
<XFiles :key="user.id" :user="user"/>
<XActivity :key="user.id" :user="user"/>
<XActivity v-if="!hideCounters" :key="user.id" :user="user"/>
</div>
</div>
</MkSpacer>
@ -284,6 +284,7 @@ const editModerationNote = ref(false);
const hideModerationNote = !iAmModerator || (defaultStore.state.privateMode && defaultStore.state.hideModerationLog);
const hideRoleList = defaultStore.state.privateMode && defaultStore.state.hideRoleList;
const hideCounters = defaultStore.reactiveState.hideCounters;
watch(moderationNote, async () => {
await misskeyApi('admin/update-user-note', { userId: props.user.id, text: moderationNote.value });

View file

@ -176,6 +176,10 @@ const routes: RouteDef[] = [{
path: '/accounts',
name: 'profile',
component: page(() => import('@/pages/settings/accounts.vue')),
}, {
path: '/laboratory',
name: 'laboratory',
component: page(() => import('@/pages/settings/laboratory.vue')),
}, {
path: '/account-stats',
name: 'other',

View file

@ -156,6 +156,10 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'deviceAccount',
default: false,
},
vacationAlert: {
where: 'deviceAccount',
default: true,
},
privateMode: {
where: 'device',
default: false,
@ -176,6 +180,10 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device',
default: false,
},
hideCounters: {
where: 'device',
default: false,
},
showPreview: {
where: 'device',
default: false,

View file

@ -25,10 +25,16 @@ SPDX-License-Identifier: AGPL-3.0-only
</MkA>
<MkA v-if="($i?.isModerator ?? $i?.isAdmin) && !$i?.twoFactorEnabled" :class="$style.item" to="/settings/security">
<span :class="$style.icon">
<i class="ti ti-circle-key" style="color: var(--error);"></i>
<i class="ti ti-circle-key"></i>
</span>
<span :class="$style.title">{{ i18n.ts.youNeedToEnableTwoFactor }}</span>
</MkA>
<MkA v-if="($i?.isModerator ?? $i?.isAdmin) && $i?.isVacation && showVacationAlert" :class="$style.item" @click.prevent.stop="removeThisAnnouncement()">
<span :class="$style.icon">
<i class="ti ti-sandbox"></i>
</span>
<span :class="$style.title">{{ i18n.ts.youAreOnVacation }}</span>
</MkA>
<MkA
v-for="announcement in $i?.unreadAnnouncements.filter(x => x.display === 'banner')"
:key="announcement.id"
@ -52,10 +58,16 @@ import { ref } from 'vue';
import { instanceName } from '@/config.js';
import { instance } from '@/instance.js';
import { $i, iAmModerator } from '@/account.js';
import { defaultStore } from '@/store.js';
import { i18n } from '@/i18n.js';
import { misskeyApi } from '@/scripts/misskey-api.js';
const unresolvedReportCount = ref<number>(0);
const showVacationAlert = defaultStore.reactiveState.vacationAlert;
function removeThisAnnouncement(): void {
defaultStore.set('vacationAlert', false);
}
if (iAmModerator) {
misskeyApi('admin/abuse-user-reports', {