usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(frontend): rename pizzax fields

This commit is contained in:
syuilo 2025-03-10 10:51:54 +09:00
parent 16ad6b3f6c
commit 08f7e7d9b3
50 changed files with 243 additions and 236 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/frontend/lib/rollup-plugin-unwind-css-module-class-name.test.ts
View File

@ -74,7 +74,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
let fetching = ref(true); let fetching = ref(true);
let images = ref([]); let images = ref([]);
function thumbnail(image) { function thumbnail(image) {
return store.state.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl; return store.s.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl;
} }
onMounted(() => { onMounted(() => {
const image = [ const image = [
@ -190,7 +190,7 @@ const index_photos = defineComponent({
let fetching = ref(true); let fetching = ref(true);
let images = ref([]); let images = ref([]);
function thumbnail(image) { function thumbnail(image) {
return store.state.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl; return store.s.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl;
} }
onMounted(() => { onMounted(() => {
const image = ["image/jpeg", "image/webp", "image/avif", "image/png", "image/gif", "image/apng", "image/vnd.mozilla.apng"]; const image = ["image/jpeg", "image/webp", "image/avif", "image/png", "image/gif", "image/apng", "image/vnd.mozilla.apng"];

12
packages/frontend/src/boot/common.ts
View File

@ -154,26 +154,26 @@ export async function common(createVue: () => App<Element>) {
//#endregion //#endregion
// NOTE: この処理は必ずクライアント更新チェック処理より後に来ること(テーマ再構築のため) // NOTE: この処理は必ずクライアント更新チェック処理より後に来ること(テーマ再構築のため)
watch(store.reactiveState.darkMode, (darkMode) => { watch(store.r.darkMode, (darkMode) => {
applyTheme(darkMode applyTheme(darkMode
? (prefer.s.darkTheme ?? defaultDarkTheme) ? (prefer.s.darkTheme ?? defaultDarkTheme)
: (prefer.s.lightTheme ?? defaultLightTheme), : (prefer.s.lightTheme ?? defaultLightTheme),
); );
}, { immediate: miLocalStorage.getItem('theme') == null }); }, { immediate: miLocalStorage.getItem('theme') == null });
document.documentElement.dataset.colorScheme = store.state.darkMode ? 'dark' : 'light'; document.documentElement.dataset.colorScheme = store.s.darkMode ? 'dark' : 'light';
const darkTheme = prefer.model('darkTheme'); const darkTheme = prefer.model('darkTheme');
const lightTheme = prefer.model('lightTheme'); const lightTheme = prefer.model('lightTheme');
watch(darkTheme, (theme) => { watch(darkTheme, (theme) => {
if (store.state.darkMode) { if (store.s.darkMode) {
applyTheme(theme ?? defaultDarkTheme); applyTheme(theme ?? defaultDarkTheme);
} }
}); });
watch(lightTheme, (theme) => { watch(lightTheme, (theme) => {
if (!store.state.darkMode) { if (!store.s.darkMode) {
applyTheme(theme ?? defaultLightTheme); applyTheme(theme ?? defaultLightTheme);
} }
}); });
@ -190,9 +190,9 @@ export async function common(createVue: () => App<Element>) {
}); });
//#endregion //#endregion
if (prefer.s.darkTheme && store.state.darkMode) { if (prefer.s.darkTheme && store.s.darkMode) {
if (miLocalStorage.getItem('themeId') !== prefer.s.darkTheme.id) applyTheme(prefer.s.darkTheme); if (miLocalStorage.getItem('themeId') !== prefer.s.darkTheme.id) applyTheme(prefer.s.darkTheme);
} else if (prefer.s.lightTheme && !store.state.darkMode) { } else if (prefer.s.lightTheme && !store.s.darkMode) {
if (miLocalStorage.getItem('themeId') !== prefer.s.lightTheme.id) applyTheme(prefer.s.lightTheme); if (miLocalStorage.getItem('themeId') !== prefer.s.lightTheme.id) applyTheme(prefer.s.lightTheme);
} }

148
packages/frontend/src/boot/main-boot.ts
View File

@ -138,7 +138,7 @@ export async function mainBoot() {
store.loaded.then(async () => { store.loaded.then(async () => {
// prefereces migration // prefereces migration
// TODO: そのうち消す // TODO: そのうち消す
if (store.state.menu.length > 0) { if (store.s.menu.length > 0) {
const themes = await misskeyApi('i/registry/get', { scope: ['client'], key: 'themes' }).catch(() => []); const themes = await misskeyApi('i/registry/get', { scope: ['client'], key: 'themes' }).catch(() => []);
if (themes.length > 0) { if (themes.length > 0) {
prefer.set('themes', themes); prefer.set('themes', themes);
@ -152,84 +152,84 @@ export async function mainBoot() {
prefer.set('lightTheme', ColdDeviceStorage.get('lightTheme')); prefer.set('lightTheme', ColdDeviceStorage.get('lightTheme'));
prefer.set('darkTheme', ColdDeviceStorage.get('darkTheme')); prefer.set('darkTheme', ColdDeviceStorage.get('darkTheme'));
prefer.set('syncDeviceDarkMode', ColdDeviceStorage.get('syncDeviceDarkMode')); prefer.set('syncDeviceDarkMode', ColdDeviceStorage.get('syncDeviceDarkMode'));
prefer.set('overridedDeviceKind', store.state.overridedDeviceKind); prefer.set('overridedDeviceKind', store.s.overridedDeviceKind);
prefer.set('widgets', store.state.widgets); prefer.set('widgets', store.s.widgets);
prefer.set('keepCw', store.state.keepCw); prefer.set('keepCw', store.s.keepCw);
prefer.set('collapseRenotes', store.state.collapseRenotes); prefer.set('collapseRenotes', store.s.collapseRenotes);
prefer.set('rememberNoteVisibility', store.state.rememberNoteVisibility); prefer.set('rememberNoteVisibility', store.s.rememberNoteVisibility);
prefer.set('uploadFolder', store.state.uploadFolder); prefer.set('uploadFolder', store.s.uploadFolder);
prefer.set('keepOriginalUploading', store.state.keepOriginalUploading); prefer.set('keepOriginalUploading', store.s.keepOriginalUploading);
prefer.set('menu', store.state.menu); prefer.set('menu', store.s.menu);
prefer.set('statusbars', store.state.statusbars); prefer.set('statusbars', store.s.statusbars);
prefer.set('pinnedUserLists', store.state.pinnedUserLists); prefer.set('pinnedUserLists', store.s.pinnedUserLists);
prefer.set('serverDisconnectedBehavior', store.state.serverDisconnectedBehavior); prefer.set('serverDisconnectedBehavior', store.s.serverDisconnectedBehavior);
prefer.set('nsfw', store.state.nsfw); prefer.set('nsfw', store.s.nsfw);
prefer.set('highlightSensitiveMedia', store.state.highlightSensitiveMedia); prefer.set('highlightSensitiveMedia', store.s.highlightSensitiveMedia);
prefer.set('animation', store.state.animation); prefer.set('animation', store.s.animation);
prefer.set('animatedMfm', store.state.animatedMfm); prefer.set('animatedMfm', store.s.animatedMfm);
prefer.set('advancedMfm', store.state.advancedMfm); prefer.set('advancedMfm', store.s.advancedMfm);
prefer.set('showReactionsCount', store.state.showReactionsCount); prefer.set('showReactionsCount', store.s.showReactionsCount);
prefer.set('enableQuickAddMfmFunction', store.state.enableQuickAddMfmFunction); prefer.set('enableQuickAddMfmFunction', store.s.enableQuickAddMfmFunction);
prefer.set('loadRawImages', store.state.loadRawImages); prefer.set('loadRawImages', store.s.loadRawImages);
prefer.set('imageNewTab', store.state.imageNewTab); prefer.set('imageNewTab', store.s.imageNewTab);
prefer.set('disableShowingAnimatedImages', store.state.disableShowingAnimatedImages); prefer.set('disableShowingAnimatedImages', store.s.disableShowingAnimatedImages);
prefer.set('emojiStyle', store.state.emojiStyle); prefer.set('emojiStyle', store.s.emojiStyle);
prefer.set('menuStyle', store.state.menuStyle); prefer.set('menuStyle', store.s.menuStyle);
prefer.set('useBlurEffectForModal', store.state.useBlurEffectForModal); prefer.set('useBlurEffectForModal', store.s.useBlurEffectForModal);
prefer.set('useBlurEffect', store.state.useBlurEffect); prefer.set('useBlurEffect', store.s.useBlurEffect);
prefer.set('showFixedPostForm', store.state.showFixedPostForm); prefer.set('showFixedPostForm', store.s.showFixedPostForm);
prefer.set('showFixedPostFormInChannel', store.state.showFixedPostFormInChannel); prefer.set('showFixedPostFormInChannel', store.s.showFixedPostFormInChannel);
prefer.set('enableInfiniteScroll', store.state.enableInfiniteScroll); prefer.set('enableInfiniteScroll', store.s.enableInfiniteScroll);
prefer.set('useReactionPickerForContextMenu', store.state.useReactionPickerForContextMenu); prefer.set('useReactionPickerForContextMenu', store.s.useReactionPickerForContextMenu);
prefer.set('showGapBetweenNotesInTimeline', store.state.showGapBetweenNotesInTimeline); prefer.set('showGapBetweenNotesInTimeline', store.s.showGapBetweenNotesInTimeline);
prefer.set('instanceTicker', store.state.instanceTicker); prefer.set('instanceTicker', store.s.instanceTicker);
prefer.set('emojiPickerScale', store.state.emojiPickerScale); prefer.set('emojiPickerScale', store.s.emojiPickerScale);
prefer.set('emojiPickerWidth', store.state.emojiPickerWidth); prefer.set('emojiPickerWidth', store.s.emojiPickerWidth);
prefer.set('emojiPickerHeight', store.state.emojiPickerHeight); prefer.set('emojiPickerHeight', store.s.emojiPickerHeight);
prefer.set('emojiPickerStyle', store.state.emojiPickerStyle); prefer.set('emojiPickerStyle', store.s.emojiPickerStyle);
prefer.set('reportError', store.state.reportError); prefer.set('reportError', store.s.reportError);
prefer.set('squareAvatars', store.state.squareAvatars); prefer.set('squareAvatars', store.s.squareAvatars);
prefer.set('showAvatarDecorations', store.state.showAvatarDecorations); prefer.set('showAvatarDecorations', store.s.showAvatarDecorations);
prefer.set('numberOfPageCache', store.state.numberOfPageCache); prefer.set('numberOfPageCache', store.s.numberOfPageCache);
prefer.set('showNoteActionsOnlyHover', store.state.showNoteActionsOnlyHover); prefer.set('showNoteActionsOnlyHover', store.s.showNoteActionsOnlyHover);
prefer.set('showClipButtonInNoteFooter', store.state.showClipButtonInNoteFooter); prefer.set('showClipButtonInNoteFooter', store.s.showClipButtonInNoteFooter);
prefer.set('reactionsDisplaySize', store.state.reactionsDisplaySize); prefer.set('reactionsDisplaySize', store.s.reactionsDisplaySize);
prefer.set('limitWidthOfReaction', store.state.limitWidthOfReaction); prefer.set('limitWidthOfReaction', store.s.limitWidthOfReaction);
prefer.set('forceShowAds', store.state.forceShowAds); prefer.set('forceShowAds', store.s.forceShowAds);
prefer.set('aiChanMode', store.state.aiChanMode); prefer.set('aiChanMode', store.s.aiChanMode);
prefer.set('devMode', store.state.devMode); prefer.set('devMode', store.s.devMode);
prefer.set('mediaListWithOneImageAppearance', store.state.mediaListWithOneImageAppearance); prefer.set('mediaListWithOneImageAppearance', store.s.mediaListWithOneImageAppearance);
prefer.set('notificationPosition', store.state.notificationPosition); prefer.set('notificationPosition', store.s.notificationPosition);
prefer.set('notificationStackAxis', store.state.notificationStackAxis); prefer.set('notificationStackAxis', store.s.notificationStackAxis);
prefer.set('enableCondensedLine', store.state.enableCondensedLine); prefer.set('enableCondensedLine', store.s.enableCondensedLine);
prefer.set('keepScreenOn', store.state.keepScreenOn); prefer.set('keepScreenOn', store.s.keepScreenOn);
prefer.set('disableStreamingTimeline', store.state.disableStreamingTimeline); prefer.set('disableStreamingTimeline', store.s.disableStreamingTimeline);
prefer.set('useGroupedNotifications', store.state.useGroupedNotifications); prefer.set('useGroupedNotifications', store.s.useGroupedNotifications);
prefer.set('dataSaver', store.state.dataSaver); prefer.set('dataSaver', store.s.dataSaver);
prefer.set('enableSeasonalScreenEffect', store.state.enableSeasonalScreenEffect); prefer.set('enableSeasonalScreenEffect', store.s.enableSeasonalScreenEffect);
prefer.set('enableHorizontalSwipe', store.state.enableHorizontalSwipe); prefer.set('enableHorizontalSwipe', store.s.enableHorizontalSwipe);
prefer.set('useNativeUiForVideoAudioPlayer', store.state.useNativeUIForVideoAudioPlayer); prefer.set('useNativeUiForVideoAudioPlayer', store.s.useNativeUIForVideoAudioPlayer);
prefer.set('keepOriginalFilename', store.state.keepOriginalFilename); prefer.set('keepOriginalFilename', store.s.keepOriginalFilename);
prefer.set('alwaysConfirmFollow', store.state.alwaysConfirmFollow); prefer.set('alwaysConfirmFollow', store.s.alwaysConfirmFollow);
prefer.set('confirmWhenRevealingSensitiveMedia', store.state.confirmWhenRevealingSensitiveMedia); prefer.set('confirmWhenRevealingSensitiveMedia', store.s.confirmWhenRevealingSensitiveMedia);
prefer.set('contextMenu', store.state.contextMenu); prefer.set('contextMenu', store.s.contextMenu);
prefer.set('skipNoteRender', store.state.skipNoteRender); prefer.set('skipNoteRender', store.s.skipNoteRender);
prefer.set('showSoftWordMutedWord', store.state.showSoftWordMutedWord); prefer.set('showSoftWordMutedWord', store.s.showSoftWordMutedWord);
prefer.set('confirmOnReact', store.state.confirmOnReact); prefer.set('confirmOnReact', store.s.confirmOnReact);
prefer.set('sound.masterVolume', store.state.sound_masterVolume); prefer.set('sound.masterVolume', store.s.sound_masterVolume);
prefer.set('sound.notUseSound', store.state.sound_notUseSound); prefer.set('sound.notUseSound', store.s.sound_notUseSound);
prefer.set('sound.useSoundOnlyWhenActive', store.state.sound_useSoundOnlyWhenActive); prefer.set('sound.useSoundOnlyWhenActive', store.s.sound_useSoundOnlyWhenActive);
prefer.set('sound.on.note', store.state.sound_note as any); prefer.set('sound.on.note', store.s.sound_note as any);
prefer.set('sound.on.noteMy', store.state.sound_noteMy as any); prefer.set('sound.on.noteMy', store.s.sound_noteMy as any);
prefer.set('sound.on.notification', store.state.sound_notification as any); prefer.set('sound.on.notification', store.s.sound_notification as any);
prefer.set('sound.on.reaction', store.state.sound_reaction as any); prefer.set('sound.on.reaction', store.s.sound_reaction as any);
store.set('deck.profile', deckStore.state.profile); store.set('deck.profile', deckStore.state.profile);
store.set('deck.columns', deckStore.state.columns); store.set('deck.columns', deckStore.state.columns);
store.set('deck.layout', deckStore.state.layout); store.set('deck.layout', deckStore.state.layout);
store.set('menu', []); store.set('menu', []);
} }
if (store.state.accountSetupWizard !== -1) { if (store.s.accountSetupWizard !== -1) {
const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkUserSetupDialog.vue')), {}, { const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkUserSetupDialog.vue')), {}, {
closed: () => dispose(), closed: () => dispose(),
}); });
@ -502,7 +502,7 @@ export async function mainBoot() {
post(); post();
}, },
'd': () => { 'd': () => {
store.set('darkMode', !store.state.darkMode); store.set('darkMode', !store.s.darkMode);
}, },
's': () => { 's': () => {
mainRouter.push('/search'); mainRouter.push('/search');

6
packages/frontend/src/components/MkAutocomplete.vue
View File

@ -73,7 +73,7 @@ const emojiDb = computed(() => {
url: char2path(x.char), url: char2path(x.char),
})); }));
for (const index of Object.values(store.state.additionalUnicodeEmojiIndexes)) { for (const index of Object.values(store.s.additionalUnicodeEmojiIndexes)) {
for (const [emoji, keywords] of Object.entries(index)) { for (const [emoji, keywords] of Object.entries(index)) {
for (const k of keywords) { for (const k of keywords) {
unicodeEmojiDB.push({ unicodeEmojiDB.push({
@ -155,7 +155,7 @@ function complete(type: string, value: any) {
emit('done', { type, value }); emit('done', { type, value });
emit('closed'); emit('closed');
if (type === 'emoji') { if (type === 'emoji') {
let recents = store.state.recentlyUsedEmojis; let recents = store.s.recentlyUsedEmojis;
recents = recents.filter((emoji: any) => emoji !== value); recents = recents.filter((emoji: any) => emoji !== value);
recents.unshift(value); recents.unshift(value);
store.set('recentlyUsedEmojis', recents.splice(0, 32)); store.set('recentlyUsedEmojis', recents.splice(0, 32));
@ -238,7 +238,7 @@ function exec() {
} else if (props.type === 'emoji') { } else if (props.type === 'emoji') {
if (!props.q || props.q === '') { if (!props.q || props.q === '') {
// 最近使った絵文字をサジェスト // 最近使った絵文字をサジェスト
emojis.value = store.state.recentlyUsedEmojis.map(emoji => emojiDb.value.find(dbEmoji => dbEmoji.emoji === emoji)).filter(x => x) as EmojiDef[]; emojis.value = store.s.recentlyUsedEmojis.map(emoji => emojiDb.value.find(dbEmoji => dbEmoji.emoji === emoji)).filter(x => x) as EmojiDef[];
return; return;
} }

2
packages/frontend/src/components/MkCaptcha.vue
View File

@ -154,7 +154,7 @@ async function requestRender() {
captchaWidgetId.value = captcha.value.render(elem, { captchaWidgetId.value = captcha.value.render(elem, {
sitekey: props.sitekey, sitekey: props.sitekey,
theme: store.state.darkMode ? 'dark' : 'light', theme: store.s.darkMode ? 'dark' : 'light',
callback: callback, callback: callback,
'expired-callback': () => callback(undefined), 'expired-callback': () => callback(undefined),
'error-callback': () => callback(undefined), 'error-callback': () => callback(undefined),

2
packages/frontend/src/components/MkChart.vue
View File

@ -161,7 +161,7 @@ const render = () => {
chartInstance.destroy(); chartInstance.destroy();
} }
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const maxes = chartData.series.map((x, i) => Math.max(...x.data.map(d => d.y))); const maxes = chartData.series.map((x, i) => Math.max(...x.data.map(d => d.y)));

2
packages/frontend/src/components/MkCode.core.vue
View File

@ -22,7 +22,7 @@ const props = defineProps<{
}>(); }>();
const highlighter = await getHighlighter(); const highlighter = await getHighlighter();
const darkMode = store.reactiveState.darkMode; const darkMode = store.r.darkMode;
const codeLang = ref<BundledLanguage | 'aiscript'>('js'); const codeLang = ref<BundledLanguage | 'aiscript'>('js');
const [lightThemeName, darkThemeName] = await Promise.all([ const [lightThemeName, darkThemeName] = await Promise.all([

10
packages/frontend/src/components/MkEmojiPicker.vue
View File

@ -166,7 +166,7 @@ const {
emojiPickerHeight, emojiPickerHeight,
} = prefer.r; } = prefer.r;
const recentlyUsedEmojis = store.reactiveState.recentlyUsedEmojis; const recentlyUsedEmojis = store.r.recentlyUsedEmojis;
const recentlyUsedEmojisDef = computed(() => { const recentlyUsedEmojisDef = computed(() => {
return recentlyUsedEmojis.value.map(getDef); return recentlyUsedEmojis.value.map(getDef);
@ -319,7 +319,7 @@ watch(q, () => {
} }
if (matches.size >= max) return matches; if (matches.size >= max) return matches;
for (const index of Object.values(store.state.additionalUnicodeEmojiIndexes)) { for (const index of Object.values(store.s.additionalUnicodeEmojiIndexes)) {
for (const emoji of emojis) { for (const emoji of emojis) {
if (keywords.every(keyword => index[emoji.char].some(k => k.includes(keyword)))) { if (keywords.every(keyword => index[emoji.char].some(k => k.includes(keyword)))) {
matches.add(emoji); matches.add(emoji);
@ -336,7 +336,7 @@ watch(q, () => {
} }
if (matches.size >= max) return matches; if (matches.size >= max) return matches;
for (const index of Object.values(store.state.additionalUnicodeEmojiIndexes)) { for (const index of Object.values(store.s.additionalUnicodeEmojiIndexes)) {
for (const emoji of emojis) { for (const emoji of emojis) {
if (index[emoji.char].some(k => k.startsWith(newQ))) { if (index[emoji.char].some(k => k.startsWith(newQ))) {
matches.add(emoji); matches.add(emoji);
@ -353,7 +353,7 @@ watch(q, () => {
} }
if (matches.size >= max) return matches; if (matches.size >= max) return matches;
for (const index of Object.values(store.state.additionalUnicodeEmojiIndexes)) { for (const index of Object.values(store.s.additionalUnicodeEmojiIndexes)) {
for (const emoji of emojis) { for (const emoji of emojis) {
if (index[emoji.char].some(k => k.includes(newQ))) { if (index[emoji.char].some(k => k.includes(newQ))) {
matches.add(emoji); matches.add(emoji);
@ -429,7 +429,7 @@ function chosen(emoji: string | Misskey.entities.EmojiSimple | UnicodeEmojiDef,
// 最近使った絵文字更新 // 最近使った絵文字更新
if (!pinned.value?.includes(key)) { if (!pinned.value?.includes(key)) {
let recents = store.state.recentlyUsedEmojis; let recents = store.s.recentlyUsedEmojis;
recents = recents.filter((emoji) => emoji !== key); recents = recents.filter((emoji) => emoji !== key);
recents.unshift(key); recents.unshift(key);
store.set('recentlyUsedEmojis', recents.splice(0, 32)); store.set('recentlyUsedEmojis', recents.splice(0, 32));

4
packages/frontend/src/components/MkFollowButton.vue
View File

@ -121,11 +121,11 @@ async function onClick() {
} else { } else {
await misskeyApi('following/create', { await misskeyApi('following/create', {
userId: props.user.id, userId: props.user.id,
withReplies: store.state.defaultWithReplies, withReplies: store.s.defaultWithReplies,
}); });
emit('update:user', { emit('update:user', {
...props.user, ...props.user,
withReplies: store.state.defaultWithReplies, withReplies: store.s.defaultWithReplies,
}); });
hasPendingFollowRequestFromYou.value = true; hasPendingFollowRequestFromYou.value = true;

2
packages/frontend/src/components/MkHeatmap.vue
View File

@ -106,7 +106,7 @@ async function renderChart() {
await nextTick(); await nextTick();
const color = store.state.darkMode ? '#b4e900' : '#86b300'; const color = store.s.darkMode ? '#b4e900' : '#86b300';
// 視覚上の分かりやすさのため上から最も大きい3つの値の平均を最大値とする // 視覚上の分かりやすさのため上から最も大きい3つの値の平均を最大値とする
const max = values.slice().sort((a, b) => b - a).slice(0, 3).reduce((a, b) => a + b, 0) / 3; const max = values.slice().sort((a, b) => b - a).slice(0, 3).reduce((a, b) => a + b, 0) / 3;

8
packages/frontend/src/components/MkPostForm.vue
View File

@ -176,18 +176,18 @@ const text = ref(props.initialText ?? '');
const files = ref(props.initialFiles ?? []); const files = ref(props.initialFiles ?? []);
const poll = ref<PollEditorModelValue | null>(null); const poll = ref<PollEditorModelValue | null>(null);
const useCw = ref<boolean>(!!props.initialCw); const useCw = ref<boolean>(!!props.initialCw);
const showPreview = ref(store.state.showPreview); const showPreview = ref(store.s.showPreview);
watch(showPreview, () => store.set('showPreview', showPreview.value)); watch(showPreview, () => store.set('showPreview', showPreview.value));
const showAddMfmFunction = ref(prefer.s.enableQuickAddMfmFunction); const showAddMfmFunction = ref(prefer.s.enableQuickAddMfmFunction);
watch(showAddMfmFunction, () => prefer.set('enableQuickAddMfmFunction', showAddMfmFunction.value)); watch(showAddMfmFunction, () => prefer.set('enableQuickAddMfmFunction', showAddMfmFunction.value));
const cw = ref<string | null>(props.initialCw ?? null); const cw = ref<string | null>(props.initialCw ?? null);
const localOnly = ref(props.initialLocalOnly ?? (prefer.s.rememberNoteVisibility ? store.state.localOnly : prefer.s.defaultNoteLocalOnly)); const localOnly = ref(props.initialLocalOnly ?? (prefer.s.rememberNoteVisibility ? store.s.localOnly : prefer.s.defaultNoteLocalOnly));
const visibility = ref(props.initialVisibility ?? (prefer.s.rememberNoteVisibility ? store.state.visibility : prefer.s.defaultNoteVisibility)); const visibility = ref(props.initialVisibility ?? (prefer.s.rememberNoteVisibility ? store.s.visibility : prefer.s.defaultNoteVisibility));
const visibleUsers = ref<Misskey.entities.UserDetailed[]>([]); const visibleUsers = ref<Misskey.entities.UserDetailed[]>([]);
if (props.initialVisibleUsers) { if (props.initialVisibleUsers) {
props.initialVisibleUsers.forEach(u => pushVisibleUser(u)); props.initialVisibleUsers.forEach(u => pushVisibleUser(u));
} }
const reactionAcceptance = ref(store.state.reactionAcceptance); const reactionAcceptance = ref(store.s.reactionAcceptance);
const draghover = ref(false); const draghover = ref(false);
const quoteId = ref<string | null>(null); const quoteId = ref<string | null>(null);
const hasNotSpecifiedMentions = ref(false); const hasNotSpecifiedMentions = ref(false);

2
packages/frontend/src/components/MkRetentionHeatmap.vue
View File

@ -75,7 +75,7 @@ async function renderChart() {
await nextTick(); await nextTick();
const color = store.state.darkMode ? '#b4e900' : '#86b300'; const color = store.s.darkMode ? '#b4e900' : '#86b300';
const getYYYYMMDD = (date: Date) => { const getYYYYMMDD = (date: Date) => {
const y = date.getFullYear().toString().padStart(2, '0'); const y = date.getFullYear().toString().padStart(2, '0');

2
packages/frontend/src/components/MkRetentionLineChart.vue
View File

@ -42,7 +42,7 @@ const getDate = (ymd: string) => {
onMounted(async () => { onMounted(async () => {
let raw = await misskeyApi('retention', { }); let raw = await misskeyApi('retention', { });
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const accent = tinycolor(getComputedStyle(document.documentElement).getPropertyValue('--MI_THEME-accent')); const accent = tinycolor(getComputedStyle(document.documentElement).getPropertyValue('--MI_THEME-accent'));
const color = accent.toHex(); const color = accent.toHex();

2
packages/frontend/src/components/MkUrlPreview.vue
View File

@ -34,7 +34,7 @@ SPDX-License-Identifier: AGPL-3.0-only
sandbox="allow-popups allow-popups-to-escape-sandbox allow-scripts allow-same-origin" sandbox="allow-popups allow-popups-to-escape-sandbox allow-scripts allow-same-origin"
scrolling="no" scrolling="no"
:style="{ position: 'relative', width: '100%', height: `${tweetHeight}px`, border: 0 }" :style="{ position: 'relative', width: '100%', height: `${tweetHeight}px`, border: 0 }"
:src="`https://platform.twitter.com/embed/index.html?embedId=${embedId}&amp;hideCard=false&amp;hideThread=false&amp;lang=en&amp;theme=${store.state.darkMode ? 'dark' : 'light'}&amp;id=${tweetId}`" :src="`https://platform.twitter.com/embed/index.html?embedId=${embedId}&amp;hideCard=false&amp;hideThread=false&amp;lang=en&amp;theme=${store.s.darkMode ? 'dark' : 'light'}&amp;id=${tweetId}`"
></iframe> ></iframe>
</div> </div>
<div :class="$style.action"> <div :class="$style.action">

4
packages/frontend/src/components/MkUserSelectDialog.vue
View File

@ -128,7 +128,7 @@ async function ok() {
dialogEl.value?.close(); dialogEl.value?.close();
// 最近使ったユーザー更新 // 最近使ったユーザー更新
let recents = store.state.recentlyUsedUsers; let recents = store.s.recentlyUsedUsers;
recents = recents.filter(x => x !== selected.value?.id); recents = recents.filter(x => x !== selected.value?.id);
recents.unshift(selected.value.id); recents.unshift(selected.value.id);
store.set('recentlyUsedUsers', recents.splice(0, 16)); store.set('recentlyUsedUsers', recents.splice(0, 16));
@ -141,7 +141,7 @@ function cancel() {
onMounted(() => { onMounted(() => {
misskeyApi('users/show', { misskeyApi('users/show', {
userIds: store.state.recentlyUsedUsers, userIds: store.s.recentlyUsedUsers,
}).then(foundUsers => { }).then(foundUsers => {
let _users = foundUsers; let _users = foundUsers;
_users = _users.filter((u) => { _users = _users.filter((u) => {

2
packages/frontend/src/components/MkUserSetupDialog.vue
View File

@ -149,7 +149,7 @@ const emit = defineEmits<{
const dialog = shallowRef<InstanceType<typeof MkModalWindow>>(); const dialog = shallowRef<InstanceType<typeof MkModalWindow>>();
// eslint-disable-next-line vue/no-setup-props-reactivity-loss // eslint-disable-next-line vue/no-setup-props-reactivity-loss
const page = ref(store.state.accountSetupWizard); const page = ref(store.s.accountSetupWizard);
watch(page, () => { watch(page, () => {
store.set('accountSetupWizard', page.value); store.set('accountSetupWizard', page.value);

2
packages/frontend/src/components/MkVisitorDashboard.ActiveUsersChart.vue
View File

@ -59,7 +59,7 @@ async function renderChart() {
await nextTick(); await nextTick();
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const computedStyle = getComputedStyle(document.documentElement); const computedStyle = getComputedStyle(document.documentElement);
const accent = tinycolor(computedStyle.getPropertyValue('--MI_THEME-accent')).toHexString(); const accent = tinycolor(computedStyle.getPropertyValue('--MI_THEME-accent')).toHexString();

4
packages/frontend/src/components/global/MkAd.vue
View File

@ -67,7 +67,7 @@ const choseAd = (): Ad | null => {
return props.specify; return props.specify;
} }
const allAds = instance.ads.map(ad => store.state.mutedAds.includes(ad.id) ? { const allAds = instance.ads.map(ad => store.s.mutedAds.includes(ad.id) ? {
...ad, ...ad,
ratio: 0, ratio: 0,
} : ad); } : ad);
@ -112,7 +112,7 @@ const shouldHide = ref(!prefer.s.forceShowAds && $i && $i.policies.canHideAds &&
function reduceFrequency(): void { function reduceFrequency(): void {
if (chosen.value == null) return; if (chosen.value == null) return;
if (store.state.mutedAds.includes(chosen.value.id)) return; if (store.s.mutedAds.includes(chosen.value.id)) return;
store.push('mutedAds', chosen.value.id); store.push('mutedAds', chosen.value.id);
os.success(); os.success();
chosen.value = choseAd(); chosen.value = choseAd();

2
packages/frontend/src/components/global/MkFooterSpacer.vue
View File

@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
--> -->
<template> <template>
<div :class="[$style.spacer, store.reactiveState.darkMode.value ? $style.dark : $style.light]"></div> <div :class="[$style.spacer, store.r.darkMode.value ? $style.dark : $style.light]"></div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

92
packages/frontend/src/deck.ts
View File

@ -59,12 +59,12 @@ export const loadDeck = async () => {
try { try {
deck = await misskeyApi('i/registry/get', { deck = await misskeyApi('i/registry/get', {
scope: ['client', 'deck', 'profiles'], scope: ['client', 'deck', 'profiles'],
key: store.state['deck.profile'], key: store.s['deck.profile'],
}); });
} catch (err) { } catch (err) {
if (typeof err === 'object' && err != null && 'code' in err && err.code === 'NO_SUCH_KEY') { if (typeof err === 'object' && err != null && 'code' in err && err.code === 'NO_SUCH_KEY') {
// 後方互換性のため // 後方互換性のため
if (store.state['deck.profile'] === 'default') { if (store.s['deck.profile'] === 'default') {
saveDeck(); saveDeck();
return; return;
} }
@ -83,10 +83,10 @@ export const loadDeck = async () => {
export async function forceSaveDeck() { export async function forceSaveDeck() {
await misskeyApi('i/registry/set', { await misskeyApi('i/registry/set', {
scope: ['client', 'deck', 'profiles'], scope: ['client', 'deck', 'profiles'],
key: store.state['deck.profile'], key: store.s['deck.profile'],
value: { value: {
columns: store.reactiveState['deck.columns'].value, columns: store.r['deck.columns'].value,
layout: store.reactiveState['deck.layout'].value, layout: store.r['deck.layout'].value,
}, },
}); });
} }
@ -117,19 +117,19 @@ export function addColumn(column: Column) {
} }
export function removeColumn(id: Column['id']) { export function removeColumn(id: Column['id']) {
store.set('deck.columns', store.state['deck.columns'].filter(c => c.id !== id)); store.set('deck.columns', store.s['deck.columns'].filter(c => c.id !== id));
store.set('deck.layout', store.state['deck.layout'] store.set('deck.layout', store.s['deck.layout']
.map(ids => ids.filter(_id => _id !== id)) .map(ids => ids.filter(_id => _id !== id))
.filter(ids => ids.length > 0)); .filter(ids => ids.length > 0));
saveDeck(); saveDeck();
} }
export function swapColumn(a: Column['id'], b: Column['id']) { export function swapColumn(a: Column['id'], b: Column['id']) {
const aX = store.state['deck.layout'].findIndex(ids => ids.indexOf(a) !== -1); const aX = store.s['deck.layout'].findIndex(ids => ids.indexOf(a) !== -1);
const aY = store.state['deck.layout'][aX].findIndex(id => id === a); const aY = store.s['deck.layout'][aX].findIndex(id => id === a);
const bX = store.state['deck.layout'].findIndex(ids => ids.indexOf(b) !== -1); const bX = store.s['deck.layout'].findIndex(ids => ids.indexOf(b) !== -1);
const bY = store.state['deck.layout'][bX].findIndex(id => id === b); const bY = store.s['deck.layout'][bX].findIndex(id => id === b);
const layout = deepClone(store.state['deck.layout']); const layout = deepClone(store.s['deck.layout']);
layout[aX][aY] = b; layout[aX][aY] = b;
layout[bX][bY] = a; layout[bX][bY] = a;
store.set('deck.layout', layout); store.set('deck.layout', layout);
@ -137,12 +137,12 @@ export function swapColumn(a: Column['id'], b: Column['id']) {
} }
export function swapLeftColumn(id: Column['id']) { export function swapLeftColumn(id: Column['id']) {
const layout = deepClone(store.state['deck.layout']); const layout = deepClone(store.s['deck.layout']);
store.state['deck.layout'].some((ids, i) => { store.s['deck.layout'].some((ids, i) => {
if (ids.includes(id)) { if (ids.includes(id)) {
const left = store.state['deck.layout'][i - 1]; const left = store.s['deck.layout'][i - 1];
if (left) { if (left) {
layout[i - 1] = store.state['deck.layout'][i]; layout[i - 1] = store.s['deck.layout'][i];
layout[i] = left; layout[i] = left;
store.set('deck.layout', layout); store.set('deck.layout', layout);
} }
@ -154,12 +154,12 @@ export function swapLeftColumn(id: Column['id']) {
} }
export function swapRightColumn(id: Column['id']) { export function swapRightColumn(id: Column['id']) {
const layout = deepClone(store.state['deck.layout']); const layout = deepClone(store.s['deck.layout']);
store.state['deck.layout'].some((ids, i) => { store.s['deck.layout'].some((ids, i) => {
if (ids.includes(id)) { if (ids.includes(id)) {
const right = store.state['deck.layout'][i + 1]; const right = store.s['deck.layout'][i + 1];
if (right) { if (right) {
layout[i + 1] = store.state['deck.layout'][i]; layout[i + 1] = store.s['deck.layout'][i];
layout[i] = right; layout[i] = right;
store.set('deck.layout', layout); store.set('deck.layout', layout);
} }
@ -171,9 +171,9 @@ export function swapRightColumn(id: Column['id']) {
} }
export function swapUpColumn(id: Column['id']) { export function swapUpColumn(id: Column['id']) {
const layout = deepClone(store.state['deck.layout']); const layout = deepClone(store.s['deck.layout']);
const idsIndex = store.state['deck.layout'].findIndex(ids => ids.includes(id)); const idsIndex = store.s['deck.layout'].findIndex(ids => ids.includes(id));
const ids = deepClone(store.state['deck.layout'][idsIndex]); const ids = deepClone(store.s['deck.layout'][idsIndex]);
ids.some((x, i) => { ids.some((x, i) => {
if (x === id) { if (x === id) {
const up = ids[i - 1]; const up = ids[i - 1];
@ -192,9 +192,9 @@ export function swapUpColumn(id: Column['id']) {
} }
export function swapDownColumn(id: Column['id']) { export function swapDownColumn(id: Column['id']) {
const layout = deepClone(store.state['deck.layout']); const layout = deepClone(store.s['deck.layout']);
const idsIndex = store.state['deck.layout'].findIndex(ids => ids.includes(id)); const idsIndex = store.s['deck.layout'].findIndex(ids => ids.includes(id));
const ids = deepClone(store.state['deck.layout'][idsIndex]); const ids = deepClone(store.s['deck.layout'][idsIndex]);
ids.some((x, i) => { ids.some((x, i) => {
if (x === id) { if (x === id) {
const down = ids[i + 1]; const down = ids[i + 1];
@ -213,8 +213,8 @@ export function swapDownColumn(id: Column['id']) {
} }
export function stackLeftColumn(id: Column['id']) { export function stackLeftColumn(id: Column['id']) {
let layout = deepClone(store.state['deck.layout']); let layout = deepClone(store.s['deck.layout']);
const i = store.state['deck.layout'].findIndex(ids => ids.includes(id)); const i = store.s['deck.layout'].findIndex(ids => ids.includes(id));
layout = layout.map(ids => ids.filter(_id => _id !== id)); layout = layout.map(ids => ids.filter(_id => _id !== id));
layout[i - 1].push(id); layout[i - 1].push(id);
layout = layout.filter(ids => ids.length > 0); layout = layout.filter(ids => ids.length > 0);
@ -223,15 +223,15 @@ export function stackLeftColumn(id: Column['id']) {
} }
export function popRightColumn(id: Column['id']) { export function popRightColumn(id: Column['id']) {
let layout = deepClone(store.state['deck.layout']); let layout = deepClone(store.s['deck.layout']);
const i = store.state['deck.layout'].findIndex(ids => ids.includes(id)); const i = store.s['deck.layout'].findIndex(ids => ids.includes(id));
const affected = layout[i]; const affected = layout[i];
layout = layout.map(ids => ids.filter(_id => _id !== id)); layout = layout.map(ids => ids.filter(_id => _id !== id));
layout.splice(i + 1, 0, [id]); layout.splice(i + 1, 0, [id]);
layout = layout.filter(ids => ids.length > 0); layout = layout.filter(ids => ids.length > 0);
store.set('deck.layout', layout); store.set('deck.layout', layout);
const columns = deepClone(store.state['deck.columns']); const columns = deepClone(store.s['deck.columns']);
for (const column of columns) { for (const column of columns) {
if (affected.includes(column.id)) { if (affected.includes(column.id)) {
column.active = true; column.active = true;
@ -243,9 +243,9 @@ export function popRightColumn(id: Column['id']) {
} }
export function addColumnWidget(id: Column['id'], widget: ColumnWidget) { export function addColumnWidget(id: Column['id'], widget: ColumnWidget) {
const columns = deepClone(store.state['deck.columns']); const columns = deepClone(store.s['deck.columns']);
const columnIndex = store.state['deck.columns'].findIndex(c => c.id === id); const columnIndex = store.s['deck.columns'].findIndex(c => c.id === id);
const column = deepClone(store.state['deck.columns'][columnIndex]); const column = deepClone(store.s['deck.columns'][columnIndex]);
if (column == null) return; if (column == null) return;
if (column.widgets == null) column.widgets = []; if (column.widgets == null) column.widgets = [];
column.widgets.unshift(widget); column.widgets.unshift(widget);
@ -255,9 +255,9 @@ export function addColumnWidget(id: Column['id'], widget: ColumnWidget) {
} }
export function removeColumnWidget(id: Column['id'], widget: ColumnWidget) { export function removeColumnWidget(id: Column['id'], widget: ColumnWidget) {
const columns = deepClone(store.state['deck.columns']); const columns = deepClone(store.s['deck.columns']);
const columnIndex = store.state['deck.columns'].findIndex(c => c.id === id); const columnIndex = store.s['deck.columns'].findIndex(c => c.id === id);
const column = deepClone(store.state['deck.columns'][columnIndex]); const column = deepClone(store.s['deck.columns'][columnIndex]);
if (column == null) return; if (column == null) return;
if (column.widgets == null) column.widgets = []; if (column.widgets == null) column.widgets = [];
column.widgets = column.widgets.filter(w => w.id !== widget.id); column.widgets = column.widgets.filter(w => w.id !== widget.id);
@ -267,9 +267,9 @@ export function removeColumnWidget(id: Column['id'], widget: ColumnWidget) {
} }
export function setColumnWidgets(id: Column['id'], widgets: ColumnWidget[]) { export function setColumnWidgets(id: Column['id'], widgets: ColumnWidget[]) {
const columns = deepClone(store.state['deck.columns']); const columns = deepClone(store.s['deck.columns']);
const columnIndex = store.state['deck.columns'].findIndex(c => c.id === id); const columnIndex = store.s['deck.columns'].findIndex(c => c.id === id);
const column = deepClone(store.state['deck.columns'][columnIndex]); const column = deepClone(store.s['deck.columns'][columnIndex]);
if (column == null) return; if (column == null) return;
column.widgets = widgets; column.widgets = widgets;
columns[columnIndex] = column; columns[columnIndex] = column;
@ -278,9 +278,9 @@ export function setColumnWidgets(id: Column['id'], widgets: ColumnWidget[]) {
} }
export function updateColumnWidget(id: Column['id'], widgetId: string, widgetData: any) { export function updateColumnWidget(id: Column['id'], widgetId: string, widgetData: any) {
const columns = deepClone(store.state['deck.columns']); const columns = deepClone(store.s['deck.columns']);
const columnIndex = store.state['deck.columns'].findIndex(c => c.id === id); const columnIndex = store.s['deck.columns'].findIndex(c => c.id === id);
const column = deepClone(store.state['deck.columns'][columnIndex]); const column = deepClone(store.s['deck.columns'][columnIndex]);
if (column == null) return; if (column == null) return;
if (column.widgets == null) column.widgets = []; if (column.widgets == null) column.widgets = [];
column.widgets = column.widgets.map(w => w.id === widgetId ? { column.widgets = column.widgets.map(w => w.id === widgetId ? {
@ -293,9 +293,9 @@ export function updateColumnWidget(id: Column['id'], widgetId: string, widgetDat
} }
export function updateColumn(id: Column['id'], column: Partial<Column>) { export function updateColumn(id: Column['id'], column: Partial<Column>) {
const columns = deepClone(store.state['deck.columns']); const columns = deepClone(store.s['deck.columns']);
const columnIndex = store.state['deck.columns'].findIndex(c => c.id === id); const columnIndex = store.s['deck.columns'].findIndex(c => c.id === id);
const currentColumn = deepClone(store.state['deck.columns'][columnIndex]); const currentColumn = deepClone(store.s['deck.columns'][columnIndex]);
if (currentColumn == null) return; if (currentColumn == null) return;
for (const [k, v] of Object.entries(column)) { for (const [k, v] of Object.entries(column)) {
currentColumn[k] = v; currentColumn[k] = v;

2
packages/frontend/src/pages/about-misskey.vue
View File

@ -406,7 +406,7 @@ const easterEggEngine = ref<{ stop: () => void } | null>(null);
const containerEl = shallowRef<HTMLElement>(); const containerEl = shallowRef<HTMLElement>();
function iconLoaded() { function iconLoaded() {
const emojis = store.state.reactions; const emojis = store.s.reactions;
const containerWidth = containerEl.value.offsetWidth; const containerWidth = containerEl.value.offsetWidth;
for (let i = 0; i < 32; i++) { for (let i = 0; i < 32; i++) {
easterEggEmojis.value.push({ easterEggEmojis.value.push({

2
packages/frontend/src/pages/admin/abuses.vue
View File

@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkButton link to="/admin/abuse-report-notification-recipient" primary>{{ i18n.ts.notificationSetting }}</MkButton> <MkButton link to="/admin/abuse-report-notification-recipient" primary>{{ i18n.ts.notificationSetting }}</MkButton>
</div> </div>
<MkInfo v-if="!store.reactiveState.abusesTutorial.value" closable @close="closeTutorial()"> <MkInfo v-if="!store.r.abusesTutorial.value" closable @close="closeTutorial()">
{{ i18n.ts._abuseUserReport.resolveTutorial }} {{ i18n.ts._abuseUserReport.resolveTutorial }}
</MkInfo> </MkInfo>

2
packages/frontend/src/pages/admin/overview.active-users.vue
View File

@ -54,7 +54,7 @@ async function renderChart() {
const raw = await misskeyApi('charts/active-users', { limit: chartLimit, span: 'day' }); const raw = await misskeyApi('charts/active-users', { limit: chartLimit, span: 'day' });
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const colorRead = '#3498db'; const colorRead = '#3498db';
const colorWrite = '#2ecc71'; const colorWrite = '#2ecc71';

2
packages/frontend/src/pages/admin/overview.ap-requests.vue
View File

@ -68,7 +68,7 @@ onMounted(async () => {
const raw = await misskeyApi('charts/ap-request', { limit: chartLimit, span: 'day' }); const raw = await misskeyApi('charts/ap-request', { limit: chartLimit, span: 'day' });
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const succColor = '#87e000'; const succColor = '#87e000';
const failColor = '#ff4400'; const failColor = '#ff4400';

2
packages/frontend/src/pages/admin/overview.queue.chart.vue
View File

@ -67,7 +67,7 @@ const color =
'?' as never; '?' as never;
onMounted(() => { onMounted(() => {
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
chartInstance = new Chart(chartEl.value, { chartInstance = new Chart(chartEl.value, {
type: 'line', type: 'line',

2
packages/frontend/src/pages/admin/queue.chart.chart.vue
View File

@ -67,7 +67,7 @@ const color =
'?' as never; '?' as never;
onMounted(() => { onMounted(() => {
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
chartInstance = new Chart(chartEl.value, { chartInstance = new Chart(chartEl.value, {
type: 'line', type: 'line',

2
packages/frontend/src/pages/drop-and-fusion.game.vue
View File

@ -56,7 +56,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div> </div>
<div ref="containerEl" :class="[$style.gameContainer, { [$style.gameOver]: isGameOver && !replaying }]" @contextmenu.stop.prevent @click.stop.prevent="onClick" @touchmove.stop.prevent="onTouchmove" @touchend="onTouchend" @mousemove="onMousemove"> <div ref="containerEl" :class="[$style.gameContainer, { [$style.gameOver]: isGameOver && !replaying }]" @contextmenu.stop.prevent @click.stop.prevent="onClick" @touchmove.stop.prevent="onTouchmove" @touchend="onTouchend" @mousemove="onMousemove">
<img v-if="store.state.darkMode" src="/client-assets/drop-and-fusion/frame-dark.svg" :class="$style.mainFrameImg"/> <img v-if="store.s.darkMode" src="/client-assets/drop-and-fusion/frame-dark.svg" :class="$style.mainFrameImg"/>
<img v-else src="/client-assets/drop-and-fusion/frame-light.svg" :class="$style.mainFrameImg"/> <img v-else src="/client-assets/drop-and-fusion/frame-light.svg" :class="$style.mainFrameImg"/>
<canvas ref="canvasEl" :class="$style.canvas"/> <canvas ref="canvasEl" :class="$style.canvas"/>
<Transition <Transition

4
packages/frontend/src/pages/settings/emoji-picker.vue
View File

@ -154,8 +154,8 @@ import MkFolder from '@/components/MkFolder.vue';
import { prefer } from '@/preferences.js'; import { prefer } from '@/preferences.js';
import MkPreferenceContainer from '@/components/MkPreferenceContainer.vue'; import MkPreferenceContainer from '@/components/MkPreferenceContainer.vue';
const pinnedEmojisForReaction: Ref<string[]> = ref(deepClone(store.state.reactions)); const pinnedEmojisForReaction: Ref<string[]> = ref(deepClone(store.s.reactions));
const pinnedEmojis: Ref<string[]> = ref(deepClone(store.state.pinnedEmojis)); const pinnedEmojis: Ref<string[]> = ref(deepClone(store.s.pinnedEmojis));
const emojiPickerScale = prefer.model('emojiPickerScale'); const emojiPickerScale = prefer.model('emojiPickerScale');
const emojiPickerWidth = prefer.model('emojiPickerWidth'); const emojiPickerWidth = prefer.model('emojiPickerWidth');

2
packages/frontend/src/pages/settings/import-export.vue
View File

@ -159,7 +159,7 @@ import { store } from '@/store.js';
const excludeMutingUsers = ref(false); const excludeMutingUsers = ref(false);
const excludeInactiveUsers = ref(false); const excludeInactiveUsers = ref(false);
const withReplies = ref(store.state.defaultWithReplies); const withReplies = ref(store.s.defaultWithReplies);
const onExportSuccess = () => { const onExportSuccess = () => {
os.alert({ os.alert({

2
packages/frontend/src/pages/settings/index.vue
View File

@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div v-if="!narrow || currentPage?.route.name == null" class="nav"> <div v-if="!narrow || currentPage?.route.name == null" class="nav">
<div class="baaadecd"> <div class="baaadecd">
<MkInfo v-if="emailNotConfigured" warn class="info">{{ i18n.ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo> <MkInfo v-if="emailNotConfigured" warn class="info">{{ i18n.ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
<MkInfo v-if="!store.reactiveState.enablePreferencesAutoCloudBackup.value && store.reactiveState.showPreferencesAutoCloudBackupSuggestion.value" class="info"> <MkInfo v-if="!store.r.enablePreferencesAutoCloudBackup.value && store.r.showPreferencesAutoCloudBackupSuggestion.value" class="info">
<div>{{ i18n.ts._preferencesBackup.autoPreferencesBackupIsNotEnabledForThisDevice }}</div> <div>{{ i18n.ts._preferencesBackup.autoPreferencesBackupIsNotEnabledForThisDevice }}</div>
<div><button class="_textButton" @click="enableAutoBackup">{{ i18n.ts.enable }}</button> | <button class="_textButton" @click="skipAutoBackup">{{ i18n.ts.skip }}</button></div> <div><button class="_textButton" @click="enableAutoBackup">{{ i18n.ts.enable }}</button> | <button class="_textButton" @click="skipAutoBackup">{{ i18n.ts.skip }}</button></div>
</MkInfo> </MkInfo>

8
packages/frontend/src/pages/settings/preferences.vue
View File

@ -337,8 +337,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<template #label><SearchLabel>{{ i18n.ts.additionalEmojiDictionary }}</SearchLabel></template> <template #label><SearchLabel>{{ i18n.ts.additionalEmojiDictionary }}</SearchLabel></template>
<div class="_buttons"> <div class="_buttons">
<template v-for="lang in emojiIndexLangs" :key="lang"> <template v-for="lang in emojiIndexLangs" :key="lang">
<MkButton v-if="store.reactiveState.additionalUnicodeEmojiIndexes.value[lang]" danger @click="removeEmojiIndex(lang)"><i class="ti ti-trash"></i> {{ i18n.ts.remove }} ({{ getEmojiIndexLangName(lang) }})</MkButton> <MkButton v-if="store.r.additionalUnicodeEmojiIndexes.value[lang]" danger @click="removeEmojiIndex(lang)"><i class="ti ti-trash"></i> {{ i18n.ts.remove }} ({{ getEmojiIndexLangName(lang) }})</MkButton>
<MkButton v-else @click="downloadEmojiIndex(lang)"><i class="ti ti-download"></i> {{ getEmojiIndexLangName(lang) }}{{ store.reactiveState.additionalUnicodeEmojiIndexes.value[lang] ? ` (${ i18n.ts.installed })` : '' }}</MkButton> <MkButton v-else @click="downloadEmojiIndex(lang)"><i class="ti ti-download"></i> {{ getEmojiIndexLangName(lang) }}{{ store.r.additionalUnicodeEmojiIndexes.value[lang] ? ` (${ i18n.ts.installed })` : '' }}</MkButton>
</template> </template>
</div> </div>
</MkFolder> </MkFolder>
@ -449,7 +449,7 @@ function getEmojiIndexLangName(targetLang: typeof emojiIndexLangs[number]) {
function downloadEmojiIndex(lang: typeof emojiIndexLangs[number]) { function downloadEmojiIndex(lang: typeof emojiIndexLangs[number]) {
async function main() { async function main() {
const currentIndexes = store.state.additionalUnicodeEmojiIndexes; const currentIndexes = store.s.additionalUnicodeEmojiIndexes;
function download() { function download() {
switch (lang) { switch (lang) {
@ -469,7 +469,7 @@ function downloadEmojiIndex(lang: typeof emojiIndexLangs[number]) {
function removeEmojiIndex(lang: string) { function removeEmojiIndex(lang: string) {
async function main() { async function main() {
const currentIndexes = store.state.additionalUnicodeEmojiIndexes; const currentIndexes = store.s.additionalUnicodeEmojiIndexes;
delete currentIndexes[lang]; delete currentIndexes[lang];
await store.set('additionalUnicodeEmojiIndexes', currentIndexes); await store.set('additionalUnicodeEmojiIndexes', currentIndexes);
} }

2
packages/frontend/src/pages/theme-editor.vue
View File

@ -200,7 +200,7 @@ async function saveAs() {
if (description.value) theme.value.desc = description.value; if (description.value) theme.value.desc = description.value;
await addTheme(theme.value); await addTheme(theme.value);
applyTheme(theme.value); applyTheme(theme.value);
if (store.state.darkMode) { if (store.s.darkMode) {
prefer.set('darkTheme', theme.value); prefer.set('darkTheme', theme.value);
} else { } else {
prefer.set('lightTheme', theme.value); prefer.set('lightTheme', theme.value);

24
packages/frontend/src/pages/timeline.vue
View File

@ -9,7 +9,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkSpacer :contentMax="800"> <MkSpacer :contentMax="800">
<MkHorizontalSwipe v-model:tab="src" :tabs="$i ? headerTabs : headerTabsWhenNotLogin"> <MkHorizontalSwipe v-model:tab="src" :tabs="$i ? headerTabs : headerTabsWhenNotLogin">
<div :key="src" ref="rootEl"> <div :key="src" ref="rootEl">
<MkInfo v-if="isBasicTimeline(src) && !store.reactiveState.timelineTutorials.value[src]" style="margin-bottom: var(--MI-margin);" closable @close="closeTutorial()"> <MkInfo v-if="isBasicTimeline(src) && !store.r.timelineTutorials.value[src]" style="margin-bottom: var(--MI-margin);" closable @close="closeTutorial()">
{{ i18n.ts._timelineDescription[src] }} {{ i18n.ts._timelineDescription[src] }}
</MkInfo> </MkInfo>
<MkPostForm v-if="prefer.r.showFixedPostForm.value" :class="$style.postForm" class="post-form _panel" fixed style="margin-bottom: var(--MI-margin);"/> <MkPostForm v-if="prefer.r.showFixedPostForm.value" :class="$style.postForm" class="post-form _panel" fixed style="margin-bottom: var(--MI-margin);"/>
@ -67,18 +67,18 @@ type TimelinePageSrc = BasicTimelineType | `list:${string}`;
const queue = ref(0); const queue = ref(0);
const srcWhenNotSignin = ref<'local' | 'global'>(isAvailableBasicTimeline('local') ? 'local' : 'global'); const srcWhenNotSignin = ref<'local' | 'global'>(isAvailableBasicTimeline('local') ? 'local' : 'global');
const src = computed<TimelinePageSrc>({ const src = computed<TimelinePageSrc>({
get: () => ($i ? store.reactiveState.tl.value.src : srcWhenNotSignin.value), get: () => ($i ? store.r.tl.value.src : srcWhenNotSignin.value),
set: (x) => saveSrc(x), set: (x) => saveSrc(x),
}); });
const withRenotes = computed<boolean>({ const withRenotes = computed<boolean>({
get: () => store.reactiveState.tl.value.filter.withRenotes, get: () => store.r.tl.value.filter.withRenotes,
set: (x) => saveTlFilter('withRenotes', x), set: (x) => saveTlFilter('withRenotes', x),
}); });
// computed内での無限ループを防ぐためのフラグ // computed内での無限ループを防ぐためのフラグ
const localSocialTLFilterSwitchStore = ref<'withReplies' | 'onlyFiles' | false>( const localSocialTLFilterSwitchStore = ref<'withReplies' | 'onlyFiles' | false>(
store.reactiveState.tl.value.filter.withReplies ? 'withReplies' : store.r.tl.value.filter.withReplies ? 'withReplies' :
store.reactiveState.tl.value.filter.onlyFiles ? 'onlyFiles' : store.r.tl.value.filter.onlyFiles ? 'onlyFiles' :
false, false,
); );
@ -88,7 +88,7 @@ const withReplies = computed<boolean>({
if (['local', 'social'].includes(src.value) && localSocialTLFilterSwitchStore.value === 'onlyFiles') { if (['local', 'social'].includes(src.value) && localSocialTLFilterSwitchStore.value === 'onlyFiles') {
return false; return false;
} else { } else {
return store.reactiveState.tl.value.filter.withReplies; return store.r.tl.value.filter.withReplies;
} }
}, },
set: (x) => saveTlFilter('withReplies', x), set: (x) => saveTlFilter('withReplies', x),
@ -98,7 +98,7 @@ const onlyFiles = computed<boolean>({
if (['local', 'social'].includes(src.value) && localSocialTLFilterSwitchStore.value === 'withReplies') { if (['local', 'social'].includes(src.value) && localSocialTLFilterSwitchStore.value === 'withReplies') {
return false; return false;
} else { } else {
return store.reactiveState.tl.value.filter.onlyFiles; return store.r.tl.value.filter.onlyFiles;
} }
}, },
set: (x) => saveTlFilter('onlyFiles', x), set: (x) => saveTlFilter('onlyFiles', x),
@ -115,7 +115,7 @@ watch([withReplies, onlyFiles], ([withRepliesTo, onlyFilesTo]) => {
}); });
const withSensitive = computed<boolean>({ const withSensitive = computed<boolean>({
get: () => store.reactiveState.tl.value.filter.withSensitive, get: () => store.r.tl.value.filter.withSensitive,
set: (x) => saveTlFilter('withSensitive', x), set: (x) => saveTlFilter('withSensitive', x),
}); });
@ -196,7 +196,7 @@ async function chooseChannel(ev: MouseEvent): Promise<void> {
} }
function saveSrc(newSrc: TimelinePageSrc): void { function saveSrc(newSrc: TimelinePageSrc): void {
const out = deepMerge({ src: newSrc }, store.state.tl); const out = deepMerge({ src: newSrc }, store.s.tl);
if (newSrc.startsWith('userList:')) { if (newSrc.startsWith('userList:')) {
const id = newSrc.substring('userList:'.length); const id = newSrc.substring('userList:'.length);
@ -209,9 +209,9 @@ function saveSrc(newSrc: TimelinePageSrc): void {
} }
} }
function saveTlFilter(key: keyof typeof store.state.tl.filter, newValue: boolean) { function saveTlFilter(key: keyof typeof store.s.tl.filter, newValue: boolean) {
if (key !== 'withReplies' || $i) { if (key !== 'withReplies' || $i) {
const out = deepMerge({ filter: { [key]: newValue } }, store.state.tl); const out = deepMerge({ filter: { [key]: newValue } }, store.s.tl);
store.set('tl', out); store.set('tl', out);
} }
} }
@ -231,7 +231,7 @@ function focus(): void {
function closeTutorial(): void { function closeTutorial(): void {
if (!isBasicTimeline(src.value)) return; if (!isBasicTimeline(src.value)) return;
const before = store.state.timelineTutorials; const before = store.s.timelineTutorials;
before[src.value] = true; before[src.value] = true;
store.set('timelineTutorials', before); store.set('timelineTutorials', before);
} }

2
packages/frontend/src/pages/user/activity.following.vue
View File

@ -64,7 +64,7 @@ async function renderChart() {
const raw = await misskeyApi('charts/user/following', { userId: props.user.id, limit: chartLimit, span: 'day' }); const raw = await misskeyApi('charts/user/following', { userId: props.user.id, limit: chartLimit, span: 'day' });
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const colorFollowLocal = '#008FFB'; const colorFollowLocal = '#008FFB';
const colorFollowRemote = '#008FFB88'; const colorFollowRemote = '#008FFB88';

2
packages/frontend/src/pages/user/activity.notes.vue
View File

@ -64,7 +64,7 @@ async function renderChart() {
const raw = await misskeyApi('charts/user/notes', { userId: props.user.id, limit: chartLimit, span: 'day' }); const raw = await misskeyApi('charts/user/notes', { userId: props.user.id, limit: chartLimit, span: 'day' });
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const colorNormal = '#008FFB'; const colorNormal = '#008FFB';
const colorReply = '#FEB019'; const colorReply = '#FEB019';

2
packages/frontend/src/pages/user/activity.pv.vue
View File

@ -64,7 +64,7 @@ async function renderChart() {
const raw = await misskeyApi('charts/user/pv', { userId: props.user.id, limit: chartLimit, span: 'day' }); const raw = await misskeyApi('charts/user/pv', { userId: props.user.id, limit: chartLimit, span: 'day' });
const vLineColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)'; const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
const colorUser = '#3498db'; const colorUser = '#3498db';
const colorVisitor = '#2ecc71'; const colorVisitor = '#2ecc71';

45
packages/frontend/src/pizzax.ts
View File

@ -45,8 +45,15 @@ export class Storage<T extends StateDef> {
public readonly def: T; public readonly def: T;
// TODO: これが実装されたらreadonlyにしたい: https://github.com/microsoft/TypeScript/issues/37487 // TODO: これが実装されたらreadonlyにしたい: https://github.com/microsoft/TypeScript/issues/37487
public readonly state: State<T>; /**
public readonly reactiveState: ReactiveState<T>; * static / state の略 (static が予約語のため)
*/
public readonly s: State<T>;
/**
* reactive の略
*/
public readonly r: ReactiveState<T>;
private pizzaxChannel: BroadcastChannel<PizzaxChannelMessage<T>>; private pizzaxChannel: BroadcastChannel<PizzaxChannelMessage<T>>;
@ -70,12 +77,12 @@ export class Storage<T extends StateDef> {
this.pizzaxChannel = new BroadcastChannel(`pizzax::${key}`); this.pizzaxChannel = new BroadcastChannel(`pizzax::${key}`);
this.state = {} as State<T>; this.s = {} as State<T>;
this.reactiveState = {} as ReactiveState<T>; this.r = {} as ReactiveState<T>;
for (const [k, v] of Object.entries(def) as [keyof T, T[keyof T]['default']][]) { for (const [k, v] of Object.entries(def) as [keyof T, T[keyof T]['default']][]) {
this.state[k] = v.default; this.s[k] = v.default;
this.reactiveState[k] = ref(v.default); this.r[k] = ref(v.default);
} }
this.ready = this.init(); this.ready = this.init();
@ -106,13 +113,13 @@ export class Storage<T extends StateDef> {
for (const [k, v] of Object.entries(this.def) as [keyof T, T[keyof T]['default']][]) { for (const [k, v] of Object.entries(this.def) as [keyof T, T[keyof T]['default']][]) {
if (v.where === 'device' && Object.prototype.hasOwnProperty.call(deviceState, k)) { if (v.where === 'device' && Object.prototype.hasOwnProperty.call(deviceState, k)) {
this.reactiveState[k].value = this.state[k] = this.mergeState<T[keyof T]['default']>(deviceState[k], v.default); this.r[k].value = this.s[k] = this.mergeState<T[keyof T]['default']>(deviceState[k], v.default);
} else if (v.where === 'account' && $i && Object.prototype.hasOwnProperty.call(registryCache, k)) { } else if (v.where === 'account' && $i && Object.prototype.hasOwnProperty.call(registryCache, k)) {
this.reactiveState[k].value = this.state[k] = this.mergeState<T[keyof T]['default']>(registryCache[k], v.default); this.r[k].value = this.s[k] = this.mergeState<T[keyof T]['default']>(registryCache[k], v.default);
} else if (v.where === 'deviceAccount' && Object.prototype.hasOwnProperty.call(deviceAccountState, k)) { } else if (v.where === 'deviceAccount' && Object.prototype.hasOwnProperty.call(deviceAccountState, k)) {
this.reactiveState[k].value = this.state[k] = this.mergeState<T[keyof T]['default']>(deviceAccountState[k], v.default); this.r[k].value = this.s[k] = this.mergeState<T[keyof T]['default']>(deviceAccountState[k], v.default);
} else { } else {
this.reactiveState[k].value = this.state[k] = v.default; this.r[k].value = this.s[k] = v.default;
} }
} }
@ -120,7 +127,7 @@ export class Storage<T extends StateDef> {
// アカウント変更すればunisonReloadが効くため、このreturnが発火することは // アカウント変更すればunisonReloadが効くため、このreturnが発火することは
// まずないと思うけど一応弾いておく // まずないと思うけど一応弾いておく
if (where === 'deviceAccount' && !($i && userId !== $i.id)) return; if (where === 'deviceAccount' && !($i && userId !== $i.id)) return;
this.reactiveState[key].value = this.state[key] = value; this.r[key].value = this.s[key] = value;
}); });
if ($i) { if ($i) {
@ -128,9 +135,9 @@ export class Storage<T extends StateDef> {
// streamingのuser storage updateイベントを監視して更新 // streamingのuser storage updateイベントを監視して更新
connection.on('registryUpdated', ({ scope, key, value }: { scope?: string[], key: keyof T, value: T[typeof key]['default'] }) => { connection.on('registryUpdated', ({ scope, key, value }: { scope?: string[], key: keyof T, value: T[typeof key]['default'] }) => {
if (!scope || scope.length !== 2 || scope[0] !== 'client' || scope[1] !== this.key || this.state[key] === value) return; if (!scope || scope.length !== 2 || scope[0] !== 'client' || scope[1] !== this.key || this.s[key] === value) return;
this.reactiveState[key].value = this.state[key] = value; this.r[key].value = this.s[key] = value;
this.addIdbSetJob(async () => { this.addIdbSetJob(async () => {
const cache = await get(this.registryCacheKeyName); const cache = await get(this.registryCacheKeyName);
@ -156,10 +163,10 @@ export class Storage<T extends StateDef> {
for (const [k, v] of Object.entries(this.def) as [keyof T, T[keyof T]['default']][]) { for (const [k, v] of Object.entries(this.def) as [keyof T, T[keyof T]['default']][]) {
if (v.where === 'account') { if (v.where === 'account') {
if (Object.prototype.hasOwnProperty.call(kvs, k)) { if (Object.prototype.hasOwnProperty.call(kvs, k)) {
this.reactiveState[k].value = this.state[k] = (kvs as Partial<T>)[k]; this.r[k].value = this.s[k] = (kvs as Partial<T>)[k];
cache[k] = (kvs as Partial<T>)[k]; cache[k] = (kvs as Partial<T>)[k];
} else { } else {
this.reactiveState[k].value = this.state[k] = v.default; this.r[k].value = this.s[k] = v.default;
} }
} }
} }
@ -179,7 +186,7 @@ export class Storage<T extends StateDef> {
// (JSON.parse(JSON.stringify(value))の代わり) // (JSON.parse(JSON.stringify(value))の代わり)
const rawValue = deepClone(value); const rawValue = deepClone(value);
this.reactiveState[key].value = this.state[key] = rawValue; this.r[key].value = this.s[key] = rawValue;
return this.addIdbSetJob(async () => { return this.addIdbSetJob(async () => {
switch (this.def[key].where) { switch (this.def[key].where) {
@ -224,7 +231,7 @@ export class Storage<T extends StateDef> {
} }
public push<K extends keyof T>(key: K, value: ArrayElement<T[K]['default']>): void { public push<K extends keyof T>(key: K, value: ArrayElement<T[K]['default']>): void {
const currentState = this.state[key]; const currentState = this.s[key];
this.set(key, [...currentState, value]); this.set(key, [...currentState, value]);
} }
@ -246,9 +253,9 @@ export class Storage<T extends StateDef> {
get: () => R; get: () => R;
set: (value: R) => void; set: (value: R) => void;
} { } {
const valueRef = ref(this.state[key]); const valueRef = ref(this.s[key]);
const stop = watch(this.reactiveState[key], val => { const stop = watch(this.r[key], val => {
valueRef.value = val; valueRef.value = val;
}); });

12
packages/frontend/src/plugin.ts
View File

@ -93,7 +93,7 @@ export async function parsePluginMeta(code: string): Promise<AiScriptPluginMeta>
export async function authorizePlugin(plugin: Plugin) { export async function authorizePlugin(plugin: Plugin) {
if (plugin.permissions == null || plugin.permissions.length === 0) return; if (plugin.permissions == null || plugin.permissions.length === 0) return;
if (Object.hasOwn(store.state.pluginTokens, plugin.installId)) return; if (Object.hasOwn(store.s.pluginTokens, plugin.installId)) return;
const token = await new Promise<string>((res, rej) => { const token = await new Promise<string>((res, rej) => {
const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkTokenGenerateWindow.vue')), { const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkTokenGenerateWindow.vue')), {
@ -116,7 +116,7 @@ export async function authorizePlugin(plugin: Plugin) {
}); });
store.set('pluginTokens', { store.set('pluginTokens', {
...store.state.pluginTokens, ...store.s.pluginTokens,
[plugin.installId]: token, [plugin.installId]: token,
}); });
} }
@ -155,11 +155,11 @@ export async function installPlugin(code: string, meta?: AiScriptPluginMeta) {
export async function uninstallPlugin(plugin: Plugin) { export async function uninstallPlugin(plugin: Plugin) {
abortPlugin(plugin); abortPlugin(plugin);
prefer.set('plugins', prefer.s.plugins.filter(x => x.installId !== plugin.installId)); prefer.set('plugins', prefer.s.plugins.filter(x => x.installId !== plugin.installId));
if (Object.hasOwn(store.state.pluginTokens, plugin.installId)) { if (Object.hasOwn(store.s.pluginTokens, plugin.installId)) {
await os.apiWithDialog('i/revoke-token', { await os.apiWithDialog('i/revoke-token', {
token: store.state.pluginTokens[plugin.installId], token: store.s.pluginTokens[plugin.installId],
}); });
const pluginTokens = { ...store.state.pluginTokens }; const pluginTokens = { ...store.s.pluginTokens };
delete pluginTokens[plugin.installId]; delete pluginTokens[plugin.installId];
store.set('pluginTokens', pluginTokens); store.set('pluginTokens', pluginTokens);
} }
@ -341,7 +341,7 @@ function createPluginEnv(opts: { plugin: Plugin; storageKey: string }): Record<s
} }
const env: Record<string, values.Value> = { const env: Record<string, values.Value> = {
...createAiScriptEnv({ ...opts, token: store.state.pluginTokens[id] }), ...createAiScriptEnv({ ...opts, token: store.s.pluginTokens[id] }),
'Plugin:register:post_form_action': values.FN_NATIVE(([title, handler]) => { 'Plugin:register:post_form_action': values.FN_NATIVE(([title, handler]) => {
utils.assertString(title); utils.assertString(title);

2
packages/frontend/src/preferences.ts
View File

@ -65,7 +65,7 @@ let latestBackupAt = 0;
window.setInterval(() => { window.setInterval(() => {
if ($i == null) return; if ($i == null) return;
if (!store.state.enablePreferencesAutoCloudBackup) return; if (!store.s.enablePreferencesAutoCloudBackup) return;
if (document.visibilityState !== 'visible') return; // 同期されていない古い値がバックアップされるのを防ぐ if (document.visibilityState !== 'visible') return; // 同期されていない古い値がバックアップされるのを防ぐ
if (profileManager.profile.modifiedAt <= latestBackupAt) return; if (profileManager.profile.modifiedAt <= latestBackupAt) return;

2
packages/frontend/src/preferences/store.ts
View File

@ -22,7 +22,7 @@ type StoreEvent<Data extends Record<string, any>> = {
export class Store<Data extends Record<string, any>> extends EventEmitter<StoreEvent<Data>> { export class Store<Data extends Record<string, any>> extends EventEmitter<StoreEvent<Data>> {
/** /**
* static の略 (static が予約語のため) * static / state の略 (static が予約語のため)
*/ */
public s = {} as { public s = {} as {
[K in keyof Data]: Data[K]; [K in keyof Data]: Data[K];

2
packages/frontend/src/preferences/utility.ts
View File

@ -21,7 +21,7 @@ function canAutoBackup() {
} }
export function getPreferencesProfileMenu(): MenuItem[] { export function getPreferencesProfileMenu(): MenuItem[] {
const autoBackupEnabled = ref(store.state.enablePreferencesAutoCloudBackup); const autoBackupEnabled = ref(store.s.enablePreferencesAutoCloudBackup);
watch(autoBackupEnabled, () => { watch(autoBackupEnabled, () => {
if (autoBackupEnabled.value) { if (autoBackupEnabled.value) {

4
packages/frontend/src/ui/_common_/navbar.vue
View File

@ -105,7 +105,7 @@ const router = useRouter();
const forceIconOnly = ref(window.innerWidth <= 1279); const forceIconOnly = ref(window.innerWidth <= 1279);
const iconOnly = computed(() => { const iconOnly = computed(() => {
return forceIconOnly.value || (store.reactiveState.menuDisplay.value === 'sideIcon'); return forceIconOnly.value || (store.r.menuDisplay.value === 'sideIcon');
}); });
const menu = computed(() => prefer.s.menu); const menu = computed(() => prefer.s.menu);
@ -123,7 +123,7 @@ function calcViewState() {
window.addEventListener('resize', calcViewState); window.addEventListener('resize', calcViewState);
watch(store.reactiveState.menuDisplay, () => { watch(store.r.menuDisplay, () => {
calcViewState(); calcViewState();
}); });

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

@ -100,7 +100,7 @@ function openAccountMenu(ev: MouseEvent) {
}, ev); }, ev);
} }
watch(store.reactiveState.menuDisplay, () => { watch(store.r.menuDisplay, () => {
calcViewState(); calcViewState();
}); });

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

@ -75,7 +75,7 @@ const widgetsShowing = ref(false);
const fullView = ref(false); const fullView = ref(false);
const globalHeaderHeight = ref(0); const globalHeaderHeight = ref(0);
const wallpaper = miLocalStorage.getItem('wallpaper') != null; const wallpaper = miLocalStorage.getItem('wallpaper') != null;
const showMenuOnTop = computed(() => store.state.menuDisplay === 'top'); const showMenuOnTop = computed(() => store.s.menuDisplay === 'top');
const live2d = shallowRef<HTMLIFrameElement>(); const live2d = shallowRef<HTMLIFrameElement>();
const widgetsLeft = ref<HTMLElement>(); const widgetsLeft = ref<HTMLElement>();
const widgetsRight = ref<HTMLElement>(); const widgetsRight = ref<HTMLElement>();
@ -97,7 +97,7 @@ provide('shouldHeaderThin', showMenuOnTop.value);
provide('forceSpacerMin', true); provide('forceSpacerMin', true);
function attachSticky(el: HTMLElement) { function attachSticky(el: HTMLElement) {
const sticky = new StickySidebar(el, 0, store.state.menuDisplay === 'top' ? 60 : 0); // TODO: ヘッダーの高さを60pxと決め打ちしているのを直す const sticky = new StickySidebar(el, 0, store.s.menuDisplay === 'top' ? 60 : 0); // TODO: ヘッダーの高さを60pxと決め打ちしているのを直す
window.addEventListener('scroll', () => { window.addEventListener('scroll', () => {
sticky.calc(window.scrollY); sticky.calc(window.scrollY);
}, { passive: true }); }, { passive: true });

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

@ -36,7 +36,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div> </div>
<div :class="$style.sideMenu"> <div :class="$style.sideMenu">
<div :class="$style.sideMenuTop"> <div :class="$style.sideMenuTop">
<button v-tooltip.noDelay.left="`${i18n.ts._deck.profile}: ${store.state['deck.profile']}`" :class="$style.sideMenuButton" class="_button" @click="changeProfile"><i class="ti ti-caret-down"></i></button> <button v-tooltip.noDelay.left="`${i18n.ts._deck.profile}: ${store.s['deck.profile']}`" :class="$style.sideMenuButton" class="_button" @click="changeProfile"><i class="ti ti-caret-down"></i></button>
<button v-tooltip.noDelay.left="i18n.ts._deck.deleteProfile" :class="$style.sideMenuButton" class="_button" @click="deleteProfile"><i class="ti ti-trash"></i></button> <button v-tooltip.noDelay.left="i18n.ts._deck.deleteProfile" :class="$style.sideMenuButton" class="_button" @click="deleteProfile"><i class="ti ti-trash"></i></button>
</div> </div>
<div :class="$style.sideMenuMiddle"> <div :class="$style.sideMenuMiddle">
@ -137,7 +137,7 @@ const columnComponents = {
mainRouter.navHook = (path, flag): boolean => { mainRouter.navHook = (path, flag): boolean => {
if (flag === 'forcePage') return false; if (flag === 'forcePage') return false;
const noMainColumn = !store.state['deck.columns'].some(x => x.type === 'main'); const noMainColumn = !store.s['deck.columns'].some(x => x.type === 'main');
if (prefer.s['deck.navWindow'] || noMainColumn) { if (prefer.s['deck.navWindow'] || noMainColumn) {
os.pageWindow(path); os.pageWindow(path);
return true; return true;
@ -160,8 +160,8 @@ watch(route, () => {
}); });
*/ */
const columns = store.reactiveState['deck.columns']; const columns = store.r['deck.columns'];
const layout = store.reactiveState['deck.layout']; const layout = store.r['deck.layout'];
const menuIndicated = computed(() => { const menuIndicated = computed(() => {
if ($i == null) return false; if ($i == null) return false;
for (const def in navbarItemDef) { for (const def in navbarItemDef) {
@ -214,12 +214,12 @@ loadDeck();
function changeProfile(ev: MouseEvent) { function changeProfile(ev: MouseEvent) {
let items: MenuItem[] = [{ let items: MenuItem[] = [{
text: store.state['deck.profile'], text: store.s['deck.profile'],
active: true, active: true,
action: () => {}, action: () => {},
}]; }];
getProfiles().then(profiles => { getProfiles().then(profiles => {
items.push(...(profiles.filter(k => k !== store.state['deck.profile']).map(k => ({ items.push(...(profiles.filter(k => k !== store.s['deck.profile']).map(k => ({
text: k, text: k,
action: () => { action: () => {
store.set('deck.profile', k); store.set('deck.profile', k);
@ -252,17 +252,17 @@ function changeProfile(ev: MouseEvent) {
async function deleteProfile() { async function deleteProfile() {
const { canceled } = await os.confirm({ const { canceled } = await os.confirm({
type: 'warning', type: 'warning',
text: i18n.tsx.deleteAreYouSure({ x: store.state['deck.profile'] }), text: i18n.tsx.deleteAreYouSure({ x: store.s['deck.profile'] }),
}); });
if (canceled) return; if (canceled) return;
os.promiseDialog((async () => { os.promiseDialog((async () => {
if (store.state['deck.profile'] === 'default') { if (store.s['deck.profile'] === 'default') {
await store.set('deck.columns', []); await store.set('deck.columns', []);
await store.set('deck.layout', []); await store.set('deck.layout', []);
await forceSaveDeck(); await forceSaveDeck();
} else { } else {
await deleteProfile_(store.state['deck.profile']); await deleteProfile_(store.s['deck.profile']);
} }
await store.set('deck.profile', 'default'); await store.set('deck.profile', 'default');
})(), () => { })(), () => {

2
packages/frontend/src/utility/emoji-picker.ts
View File

@ -25,7 +25,7 @@ class EmojiPicker {
} }
public async init() { public async init() {
const emojisRef = store.reactiveState.pinnedEmojis; const emojisRef = store.r.pinnedEmojis;
await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), { await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
src: this.src, src: this.src,
pinnedEmojis: emojisRef, pinnedEmojis: emojisRef,

4
packages/frontend/src/utility/get-note-menu.ts
View File

@ -608,8 +608,8 @@ export function getRenoteMenu(props: {
}); });
} }
const configuredVisibility = prefer.s.rememberNoteVisibility ? store.state.visibility : prefer.s.defaultNoteVisibility; const configuredVisibility = prefer.s.rememberNoteVisibility ? store.s.visibility : prefer.s.defaultNoteVisibility;
const localOnly = prefer.s.rememberNoteVisibility ? store.state.localOnly : prefer.s.defaultNoteLocalOnly; const localOnly = prefer.s.rememberNoteVisibility ? store.s.localOnly : prefer.s.defaultNoteLocalOnly;
let visibility = appearNote.visibility; let visibility = appearNote.visibility;
visibility = smallerVisibility(visibility, configuredVisibility); visibility = smallerVisibility(visibility, configuredVisibility);

2
packages/frontend/src/utility/init-chart.ts
View File

@ -52,7 +52,7 @@ export function initChart() {
// フォントカラー // フォントカラー
Chart.defaults.color = getComputedStyle(document.documentElement).getPropertyValue('--MI_THEME-fg'); Chart.defaults.color = getComputedStyle(document.documentElement).getPropertyValue('--MI_THEME-fg');
Chart.defaults.borderColor = store.state.darkMode ? 'rgba(255, 255, 255, 0.1)' : 'rgba(0, 0, 0, 0.1)'; Chart.defaults.borderColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.1)' : 'rgba(0, 0, 0, 0.1)';
Chart.defaults.animation = false; Chart.defaults.animation = false;
} }

2
packages/frontend/src/utility/reaction-picker.ts
View File

@ -21,7 +21,7 @@ class ReactionPicker {
} }
public async init() { public async init() {
const reactionsRef = store.reactiveState.reactions; const reactionsRef = store.r.reactions;
await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), { await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
src: this.src, src: this.src,
pinnedEmojis: reactionsRef, pinnedEmojis: reactionsRef,

4
packages/frontend/src/widgets/WidgetMemo.vue
View File

@ -48,7 +48,7 @@ const { widgetProps, configure } = useWidgetPropsManager(name,
emit, emit,
); );
const text = ref<string | null>(store.state.memo); const text = ref<string | null>(store.s.memo);
const changed = ref(false); const changed = ref(false);
let timeoutId; let timeoutId;
@ -63,7 +63,7 @@ const onChange = () => {
timeoutId = window.setTimeout(saveMemo, 1000); timeoutId = window.setTimeout(saveMemo, 1000);
}; };
watch(() => store.reactiveState.memo, newText => { watch(() => store.r.memo, newText => {
text.value = newText.value; text.value = newText.value;
}); });