diff --git a/packages/frontend/src/components/global/MkAcct.vue b/packages/frontend/src/components/global/MkAcct.vue index 8a93a5adf7..3b0715a23c 100644 --- a/packages/frontend/src/components/global/MkAcct.vue +++ b/packages/frontend/src/components/global/MkAcct.vue @@ -1,8 +1,12 @@ <template> -<MkCondensedLine> +<MkCondensedLine v-if="defaultStore.state.enableCondensedLineForAcct"> <span>@{{ user.username }}</span> <span v-if="user.host || detail || defaultStore.state.showFullAcct" style="opacity: 0.5;">@{{ user.host || host }}</span> </MkCondensedLine> +<span v-else> + <span>@{{ user.username }}</span> + <span v-if="user.host || detail || defaultStore.state.showFullAcct" style="opacity: 0.5;">@{{ user.host || host }}</span> +</span> </template> <script lang="ts" setup> diff --git a/packages/frontend/src/pages/settings/other.vue b/packages/frontend/src/pages/settings/other.vue index 892ea61e75..05394b9187 100644 --- a/packages/frontend/src/pages/settings/other.vue +++ b/packages/frontend/src/pages/settings/other.vue @@ -1,32 +1,48 @@ <template> <div class="_gaps_m"> + <!-- <MkSwitch v-model="$i.injectFeaturedNote" @update:model-value="onChangeInjectFeaturedNote"> - {{ i18n.ts.showFeaturedNotesInTimeline }} + <template #label>{{ i18n.ts.showFeaturedNotesInTimeline }}</template> </MkSwitch> + --> <!-- <MkSwitch v-model="reportError">{{ i18n.ts.sendErrorReports }}<template #caption>{{ i18n.ts.sendErrorReportsDescription }}</template></MkSwitch> --> - <FormLink to="/settings/account-info">{{ i18n.ts.accountInfo }}</FormLink> + <div class="_gaps_s"> + <FormLink to="/settings/account-info"><template #icon><i class="ti ti-info-circle"></i></template>{{ i18n.ts.accountInfo }}</FormLink> + <FormLink to="/registry"><template #icon><i class="ti ti-adjustments"></i></template>{{ i18n.ts.registry }}</FormLink> + <FormLink to="/settings/delete-account"><template #icon><i class="ti ti-alert-triangle"></i></template>{{ i18n.ts.closeAccount }}</FormLink> + </div> - <FormLink to="/registry"><template #icon><i class="ti ti-adjustments"></i></template>{{ i18n.ts.registry }}</FormLink> + <MkFolder> + <template #icon><i class="ti ti-flask"></i></template> + <template #label>{{ i18n.ts.experimentalFeatures }}</template> - <FormLink to="/settings/delete-account"><template #icon><i class="ti ti-alert-triangle"></i></template>{{ i18n.ts.closeAccount }}</FormLink> + <div class="_gaps_m"> + <MkSwitch v-model="enableCondensedLineForAcct"> + <template #label>Enable condensed line for acct</template> + </MkSwitch> + </div> + </MkFolder> </div> </template> <script lang="ts" setup> -import { computed } from 'vue'; +import { computed, watch } from 'vue'; import MkSwitch from '@/components/MkSwitch.vue'; import FormLink from '@/components/form/link.vue'; +import MkFolder from '@/components/MkFolder.vue'; import * as os from '@/os'; import { defaultStore } from '@/store'; import { $i } from '@/account'; import { i18n } from '@/i18n'; import { definePageMetadata } from '@/scripts/page-metadata'; +import { unisonReload } from '@/scripts/unison-reload'; const reportError = computed(defaultStore.makeGetterSetter('reportError')); +const enableCondensedLineForAcct = computed(defaultStore.makeGetterSetter('enableCondensedLineForAcct')); function onChangeInjectFeaturedNote(v) { os.api('i/update', { @@ -36,6 +52,22 @@ function onChangeInjectFeaturedNote(v) { }); } +async function reloadAsk() { + const { canceled } = await os.confirm({ + type: 'info', + text: i18n.ts.reloadToApplySetting, + }); + if (canceled) return; + + unisonReload(); +} + +watch([ + enableCondensedLineForAcct, +], async () => { + await reloadAsk(); +}); + const headerActions = $computed(() => []); const headerTabs = $computed(() => []); diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts index af1b97d87f..c64d40edcc 100644 --- a/packages/frontend/src/store.ts +++ b/packages/frontend/src/store.ts @@ -322,6 +322,10 @@ export const defaultStore = markRaw(new Storage('base', { where: 'device', default: 'horizontal' as 'vertical' | 'horizontal', }, + enableCondensedLineForAcct: { + where: 'device', + default: true, + }, })); // TODO: 他のタブと永続化されたstateを同期