sendnrw/misskey
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(frontend): remove $store

Browse Source
This commit is contained in:
syuilo
2023-04-01 13:42:40 +09:00
parent a9f0bea60c
commit c823cbe63b
42 changed files with 150 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
packages/frontend/src/ui/_common_/common.vue
View File

@@ -11,11 +11,11 @@
<TransitionGroup
tag="div" :class="$style.notifications"
:move-class="$store.state.animation ? $style.transition_notification_move : ''"
:enter-active-class="$store.state.animation ? $style.transition_notification_enterActive : ''"
:leave-active-class="$store.state.animation ? $style.transition_notification_leaveActive : ''"
:enter-from-class="$store.state.animation ? $style.transition_notification_enterFrom : ''"
:leave-to-class="$store.state.animation ? $style.transition_notification_leaveTo : ''"
:move-class="defaultStore.state.animation ? $style.transition_notification_move : ''"
:enter-active-class="defaultStore.state.animation ? $style.transition_notification_enterActive : ''"
:leave-active-class="defaultStore.state.animation ? $style.transition_notification_leaveActive : ''"
:enter-from-class="defaultStore.state.animation ? $style.transition_notification_enterFrom : ''"
:leave-to-class="defaultStore.state.animation ? $style.transition_notification_leaveTo : ''"
>
<XNotification v-for="notification in notifications" :key="notification.id" :notification="notification" :class="$style.notification"/>
</TransitionGroup>
@@ -40,6 +40,7 @@ import * as sound from '@/scripts/sound';
import { $i } from '@/account';
import { stream } from '@/stream';
import { i18n } from '@/i18n';
import { defaultStore } from '@/store';
const XStreamIndicator = defineAsyncComponent(() => import('./stream-indicator.vue'));
const XUpload = defineAsyncComponent(() => import('./upload.vue'));

3
packages/frontend/src/ui/_common_/stream-indicator.vue
View File

@@ -1,5 +1,5 @@
<template>
<div v-if="hasDisconnected && $store.state.serverDisconnectedBehavior === 'quiet'" :class="$style.root" class="_panel _shadow" @click="resetDisconnected">
<div v-if="hasDisconnected && defaultStore.state.serverDisconnectedBehavior === 'quiet'" :class="$style.root" class="_panel _shadow" @click="resetDisconnected">
<div><i class="ti ti-alert-triangle"></i> {{ i18n.ts.disconnectedFromServer }}</div>
<div :class="$style.command" class="_buttons">
<MkButton :class="$style.commandButton" small primary @click="reload">{{ i18n.ts.reload }}</MkButton>
@@ -14,6 +14,7 @@ import { stream } from '@/stream';
import { i18n } from '@/i18n';
import MkButton from '@/components/MkButton.vue';
import * as os from '@/os';
import { defaultStore } from '@/store';
const zIndex = os.claimZIndex('high');

6
packages/frontend/src/ui/classic.header.vue
View File

@@ -50,6 +50,7 @@ import { navbarItemDef } from '@/navbar';
import { openAccountMenu } from '@/account';
import MkButton from '@/components/MkButton.vue';
import { mainRouter } from '@/router';
import { defaultStore } from '@/store';
export default defineComponent({
components: {
@@ -63,12 +64,13 @@ export default defineComponent({
connection: null,
navbarItemDef: navbarItemDef,
settingsWindowed: false,
defaultStore,
};
},
computed: {
menu(): string[] {
return this.$store.state.menu;
return defaultStore.state.menu;
},
otherNavItemIndicated(): boolean {
@@ -81,7 +83,7 @@ export default defineComponent({
},
watch: {
'$store.reactiveState.menuDisplay.value'() {
'defaultStore.reactiveState.menuDisplay.value'() {
this.calcViewState();
},
},

8
packages/frontend/src/ui/classic.sidebar.vue
View File

@@ -51,6 +51,7 @@ import MkButton from '@/components/MkButton.vue';
import { StickySidebar } from '@/scripts/sticky-sidebar';
import { mainRouter } from '@/router';
//import MisskeyLogo from '@assets/client/misskey.svg';
import { defaultStore } from '@/store';
export default defineComponent({
components: {
@@ -66,12 +67,13 @@ export default defineComponent({
navbarItemDef: navbarItemDef,
iconOnly: false,
settingsWindowed: false,
defaultStore,
};
},
computed: {
menu(): string[] {
return this.$store.state.menu;
return this.defaultStore.state.menu;
},
otherNavItemIndicated(): boolean {
@@ -84,7 +86,7 @@ export default defineComponent({
},
watch: {
'$store.reactiveState.menuDisplay.value'() {
'defaultStore.reactiveState.menuDisplay.value'() {
this.calcViewState();
},
@@ -111,7 +113,7 @@ export default defineComponent({
openInstanceMenu,
calcViewState() {
this.iconOnly = (window.innerWidth <= 1400) || (this.$store.state.menuDisplay === 'sideIcon');
this.iconOnly = (window.innerWidth <= 1400) || (this.defaultStore.state.menuDisplay === 'sideIcon');
this.settingsWindowed = (window.innerWidth > 1400);
},

6
packages/frontend/src/ui/classic.vue
View File

@@ -21,7 +21,7 @@
</div>
</div>
<Transition :name="$store.state.animation ? 'tray-back' : ''">
<Transition :name="defaultStore.state.animation ? 'tray-back' : ''">
<div
v-if="widgetsShowing"
class="tray-back _modalBg"
@@ -30,11 +30,11 @@
></div>
</Transition>
<Transition :name="$store.state.animation ? 'tray' : ''">
<Transition :name="defaultStore.state.animation ? 'tray' : ''">
<XWidgets v-if="widgetsShowing" class="tray"/>
</Transition>
<iframe v-if="$store.state.aiChanMode" ref="live2d" class="ivnzpscs" src="https://misskey-dev.github.io/mascot-web/?scale=2&y=1.4"></iframe>
<iframe v-if="defaultStore.state.aiChanMode" ref="live2d" class="ivnzpscs" src="https://misskey-dev.github.io/mascot-web/?scale=2&y=1.4"></iframe>
<XCommon/>
</div>

17
packages/frontend/src/ui/deck.vue
View File

@@ -53,10 +53,10 @@
</div>
<Transition
:enter-active-class="$store.state.animation ? $style.transition_menuDrawerBg_enterActive : ''"
:leave-active-class="$store.state.animation ? $style.transition_menuDrawerBg_leaveActive : ''"
:enter-from-class="$store.state.animation ? $style.transition_menuDrawerBg_enterFrom : ''"
:leave-to-class="$store.state.animation ? $style.transition_menuDrawerBg_leaveTo : ''"
:enter-active-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_enterActive : ''"
:leave-active-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_leaveActive : ''"
:enter-from-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_enterFrom : ''"
:leave-to-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_leaveTo : ''"
>
<div
v-if="drawerMenuShowing"
@@ -68,10 +68,10 @@
</Transition>
<Transition
:enter-active-class="$store.state.animation ? $style.transition_menuDrawer_enterActive : ''"
:leave-active-class="$store.state.animation ? $style.transition_menuDrawer_leaveActive : ''"
:enter-from-class="$store.state.animation ? $style.transition_menuDrawer_enterFrom : ''"
:leave-to-class="$store.state.animation ? $style.transition_menuDrawer_leaveTo : ''"
:enter-active-class="defaultStore.state.animation ? $style.transition_menuDrawer_enterActive : ''"
:leave-active-class="defaultStore.state.animation ? $style.transition_menuDrawer_leaveActive : ''"
:enter-from-class="defaultStore.state.animation ? $style.transition_menuDrawer_enterFrom : ''"
:leave-to-class="defaultStore.state.animation ? $style.transition_menuDrawer_leaveTo : ''"
>
<div v-if="drawerMenuShowing" :class="$style.menu">
<XDrawerMenu/>
@@ -99,6 +99,7 @@ import { i18n } from '@/i18n';
import { mainRouter } from '@/router';
import { unisonReload } from '@/scripts/unison-reload';
import { deviceKind } from '@/scripts/device-kind';
import { defaultStore } from '@/store';
const XStatusBars = defineAsyncComponent(() => import('@/ui/_common_/statusbars.vue'));
mainRouter.navHook = (path, flag): boolean => {

32
packages/frontend/src/ui/universal.vue
View File

@@ -27,10 +27,10 @@
</div>
<Transition
:enter-active-class="$store.state.animation ? $style.transition_menuDrawerBg_enterActive : ''"
:leave-active-class="$store.state.animation ? $style.transition_menuDrawerBg_leaveActive : ''"
:enter-from-class="$store.state.animation ? $style.transition_menuDrawerBg_enterFrom : ''"
:leave-to-class="$store.state.animation ? $style.transition_menuDrawerBg_leaveTo : ''"
:enter-active-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_enterActive : ''"
:leave-active-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_leaveActive : ''"
:enter-from-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_enterFrom : ''"
:leave-to-class="defaultStore.state.animation ? $style.transition_menuDrawerBg_leaveTo : ''"
>
<div
v-if="drawerMenuShowing"
@@ -42,10 +42,10 @@
</Transition>
<Transition
:enter-active-class="$store.state.animation ? $style.transition_menuDrawer_enterActive : ''"
:leave-active-class="$store.state.animation ? $style.transition_menuDrawer_leaveActive : ''"
:enter-from-class="$store.state.animation ? $style.transition_menuDrawer_enterFrom : ''"
:leave-to-class="$store.state.animation ? $style.transition_menuDrawer_leaveTo : ''"
:enter-active-class="defaultStore.state.animation ? $style.transition_menuDrawer_enterActive : ''"
:leave-active-class="defaultStore.state.animation ? $style.transition_menuDrawer_leaveActive : ''"
:enter-from-class="defaultStore.state.animation ? $style.transition_menuDrawer_enterFrom : ''"
:leave-to-class="defaultStore.state.animation ? $style.transition_menuDrawer_leaveTo : ''"
>
<div v-if="drawerMenuShowing" :class="$style.menuDrawer">
<XDrawerMenu/>
@@ -53,10 +53,10 @@
</Transition>
<Transition
:enter-active-class="$store.state.animation ? $style.transition_widgetsDrawerBg_enterActive : ''"
:leave-active-class="$store.state.animation ? $style.transition_widgetsDrawerBg_leaveActive : ''"
:enter-from-class="$store.state.animation ? $style.transition_widgetsDrawerBg_enterFrom : ''"
:leave-to-class="$store.state.animation ? $style.transition_widgetsDrawerBg_leaveTo : ''"
:enter-active-class="defaultStore.state.animation ? $style.transition_widgetsDrawerBg_enterActive : ''"
:leave-active-class="defaultStore.state.animation ? $style.transition_widgetsDrawerBg_leaveActive : ''"
:enter-from-class="defaultStore.state.animation ? $style.transition_widgetsDrawerBg_enterFrom : ''"
:leave-to-class="defaultStore.state.animation ? $style.transition_widgetsDrawerBg_leaveTo : ''"
>
<div
v-if="widgetsShowing"
@@ -68,10 +68,10 @@
</Transition>
<Transition
:enter-active-class="$store.state.animation ? $style.transition_widgetsDrawer_enterActive : ''"
:leave-active-class="$store.state.animation ? $style.transition_widgetsDrawer_leaveActive : ''"
:enter-from-class="$store.state.animation ? $style.transition_widgetsDrawer_enterFrom : ''"
:leave-to-class="$store.state.animation ? $style.transition_widgetsDrawer_leaveTo : ''"
:enter-active-class="defaultStore.state.animation ? $style.transition_widgetsDrawer_enterActive : ''"
:leave-active-class="defaultStore.state.animation ? $style.transition_widgetsDrawer_leaveActive : ''"
:enter-from-class="defaultStore.state.animation ? $style.transition_widgetsDrawer_enterFrom : ''"
:leave-to-class="defaultStore.state.animation ? $style.transition_widgetsDrawer_leaveTo : ''"
>
<div v-if="widgetsShowing" :class="$style.widgetsDrawer">
<button class="_button" :class="$style.widgetsCloseButton" @click="widgetsShowing = false"><i class="ti ti-x"></i></button>

5
packages/frontend/src/ui/visitor/a.vue
View File

@@ -42,7 +42,7 @@ import XHeader from './header.vue';
import { host, instanceName } from '@/config';
import * as os from '@/os';
import MkButton from '@/components/MkButton.vue';
import { ColdDeviceStorage } from '@/store';
import { defaultStore, ColdDeviceStorage } from '@/store';
import { mainRouter } from '@/router';
const DESKTOP_THRESHOLD = 1100;
@@ -66,6 +66,7 @@ export default defineComponent({
},
mainRouter,
isDesktop: window.innerWidth >= DESKTOP_THRESHOLD,
defaultStore,
};
},
@@ -74,7 +75,7 @@ export default defineComponent({
return {
'd': () => {
if (ColdDeviceStorage.get('syncDeviceDarkMode')) return;
this.$store.set('darkMode', !this.$store.state.darkMode);
this.defaultStore.set('darkMode', !this.defaultStore.state.darkMode);
},
's': () => {
mainRouter.push('/search');

4
packages/frontend/src/ui/visitor/b.vue
View File

@@ -24,7 +24,7 @@
</div>
</div>
<Transition :name="$store.state.animation ? 'tray-back' : ''">
<Transition :name="'tray-back'">
<div
v-if="showMenu"
class="menu-back _modalBg"
@@ -33,7 +33,7 @@
></div>
</Transition>
<Transition :name="$store.state.animation ? 'tray' : ''">
<Transition :name="'tray'">
<div v-if="showMenu" class="menu">
<MkA to="/" class="link" active-class="active"><i class="ti ti-home icon"></i>{{ $ts.home }}</MkA>
<MkA v-if="isTimelineAvailable" to="/timeline" class="link" active-class="active"><i class="ti ti-message icon"></i>{{ $ts.timeline }}</MkA>