Skip to content

Commit

Permalink
refactor(frontend): rename pizzax fields
Browse files Browse the repository at this point in the history
  • Loading branch information
syuilo committed Mar 10, 2025
1 parent 16ad6b3 commit 08f7e7d
Show file tree
Hide file tree
Showing 50 changed files with 243 additions and 236 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
let fetching = ref(true);
let images = ref([]);
function thumbnail(image) {
return store.state.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl;
return store.s.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl;
}
onMounted(() => {
const image = [
Expand Down Expand Up @@ -190,7 +190,7 @@ const index_photos = defineComponent({
let fetching = ref(true);
let images = ref([]);
function thumbnail(image) {
return store.state.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl;
return store.s.disableShowingAnimatedImages ? getStaticImageUrl(image.url) : image.thumbnailUrl;
}
onMounted(() => {
const image = ["image/jpeg", "image/webp", "image/avif", "image/png", "image/gif", "image/apng", "image/vnd.mozilla.apng"];
Expand Down
12 changes: 6 additions & 6 deletions packages/frontend/src/boot/common.ts
Original file line number Diff line number Diff line change
Expand Up @@ -154,26 +154,26 @@ export async function common(createVue: () => App<Element>) {
//#endregion

// NOTE: この処理は必ずクライアント更新チェック処理より後に来ること(テーマ再構築のため)
watch(store.reactiveState.darkMode, (darkMode) => {
watch(store.r.darkMode, (darkMode) => {
applyTheme(darkMode
? (prefer.s.darkTheme ?? defaultDarkTheme)
: (prefer.s.lightTheme ?? defaultLightTheme),
);
}, { 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 lightTheme = prefer.model('lightTheme');

watch(darkTheme, (theme) => {
if (store.state.darkMode) {
if (store.s.darkMode) {
applyTheme(theme ?? defaultDarkTheme);
}
});

watch(lightTheme, (theme) => {
if (!store.state.darkMode) {
if (!store.s.darkMode) {
applyTheme(theme ?? defaultLightTheme);
}
});
Expand All @@ -190,9 +190,9 @@ export async function common(createVue: () => App<Element>) {
});
//#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);
} 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);
}

Expand Down
148 changes: 74 additions & 74 deletions packages/frontend/src/boot/main-boot.ts
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,7 @@ export async function mainBoot() {
store.loaded.then(async () => {
// prefereces migration
// 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(() => []);
if (themes.length > 0) {
prefer.set('themes', themes);
Expand All @@ -152,84 +152,84 @@ export async function mainBoot() {
prefer.set('lightTheme', ColdDeviceStorage.get('lightTheme'));
prefer.set('darkTheme', ColdDeviceStorage.get('darkTheme'));
prefer.set('syncDeviceDarkMode', ColdDeviceStorage.get('syncDeviceDarkMode'));
prefer.set('overridedDeviceKind', store.state.overridedDeviceKind);
prefer.set('widgets', store.state.widgets);
prefer.set('keepCw', store.state.keepCw);
prefer.set('collapseRenotes', store.state.collapseRenotes);
prefer.set('rememberNoteVisibility', store.state.rememberNoteVisibility);
prefer.set('uploadFolder', store.state.uploadFolder);
prefer.set('keepOriginalUploading', store.state.keepOriginalUploading);
prefer.set('menu', store.state.menu);
prefer.set('statusbars', store.state.statusbars);
prefer.set('pinnedUserLists', store.state.pinnedUserLists);
prefer.set('serverDisconnectedBehavior', store.state.serverDisconnectedBehavior);
prefer.set('nsfw', store.state.nsfw);
prefer.set('highlightSensitiveMedia', store.state.highlightSensitiveMedia);
prefer.set('animation', store.state.animation);
prefer.set('animatedMfm', store.state.animatedMfm);
prefer.set('advancedMfm', store.state.advancedMfm);
prefer.set('showReactionsCount', store.state.showReactionsCount);
prefer.set('enableQuickAddMfmFunction', store.state.enableQuickAddMfmFunction);
prefer.set('loadRawImages', store.state.loadRawImages);
prefer.set('imageNewTab', store.state.imageNewTab);
prefer.set('disableShowingAnimatedImages', store.state.disableShowingAnimatedImages);
prefer.set('emojiStyle', store.state.emojiStyle);
prefer.set('menuStyle', store.state.menuStyle);
prefer.set('useBlurEffectForModal', store.state.useBlurEffectForModal);
prefer.set('useBlurEffect', store.state.useBlurEffect);
prefer.set('showFixedPostForm', store.state.showFixedPostForm);
prefer.set('showFixedPostFormInChannel', store.state.showFixedPostFormInChannel);
prefer.set('enableInfiniteScroll', store.state.enableInfiniteScroll);
prefer.set('useReactionPickerForContextMenu', store.state.useReactionPickerForContextMenu);
prefer.set('showGapBetweenNotesInTimeline', store.state.showGapBetweenNotesInTimeline);
prefer.set('instanceTicker', store.state.instanceTicker);
prefer.set('emojiPickerScale', store.state.emojiPickerScale);
prefer.set('emojiPickerWidth', store.state.emojiPickerWidth);
prefer.set('emojiPickerHeight', store.state.emojiPickerHeight);
prefer.set('emojiPickerStyle', store.state.emojiPickerStyle);
prefer.set('reportError', store.state.reportError);
prefer.set('squareAvatars', store.state.squareAvatars);
prefer.set('showAvatarDecorations', store.state.showAvatarDecorations);
prefer.set('numberOfPageCache', store.state.numberOfPageCache);
prefer.set('showNoteActionsOnlyHover', store.state.showNoteActionsOnlyHover);
prefer.set('showClipButtonInNoteFooter', store.state.showClipButtonInNoteFooter);
prefer.set('reactionsDisplaySize', store.state.reactionsDisplaySize);
prefer.set('limitWidthOfReaction', store.state.limitWidthOfReaction);
prefer.set('forceShowAds', store.state.forceShowAds);
prefer.set('aiChanMode', store.state.aiChanMode);
prefer.set('devMode', store.state.devMode);
prefer.set('mediaListWithOneImageAppearance', store.state.mediaListWithOneImageAppearance);
prefer.set('notificationPosition', store.state.notificationPosition);
prefer.set('notificationStackAxis', store.state.notificationStackAxis);
prefer.set('enableCondensedLine', store.state.enableCondensedLine);
prefer.set('keepScreenOn', store.state.keepScreenOn);
prefer.set('disableStreamingTimeline', store.state.disableStreamingTimeline);
prefer.set('useGroupedNotifications', store.state.useGroupedNotifications);
prefer.set('dataSaver', store.state.dataSaver);
prefer.set('enableSeasonalScreenEffect', store.state.enableSeasonalScreenEffect);
prefer.set('enableHorizontalSwipe', store.state.enableHorizontalSwipe);
prefer.set('useNativeUiForVideoAudioPlayer', store.state.useNativeUIForVideoAudioPlayer);
prefer.set('keepOriginalFilename', store.state.keepOriginalFilename);
prefer.set('alwaysConfirmFollow', store.state.alwaysConfirmFollow);
prefer.set('confirmWhenRevealingSensitiveMedia', store.state.confirmWhenRevealingSensitiveMedia);
prefer.set('contextMenu', store.state.contextMenu);
prefer.set('skipNoteRender', store.state.skipNoteRender);
prefer.set('showSoftWordMutedWord', store.state.showSoftWordMutedWord);
prefer.set('confirmOnReact', store.state.confirmOnReact);
prefer.set('sound.masterVolume', store.state.sound_masterVolume);
prefer.set('sound.notUseSound', store.state.sound_notUseSound);
prefer.set('sound.useSoundOnlyWhenActive', store.state.sound_useSoundOnlyWhenActive);
prefer.set('sound.on.note', store.state.sound_note as any);
prefer.set('sound.on.noteMy', store.state.sound_noteMy as any);
prefer.set('sound.on.notification', store.state.sound_notification as any);
prefer.set('sound.on.reaction', store.state.sound_reaction as any);
prefer.set('overridedDeviceKind', store.s.overridedDeviceKind);
prefer.set('widgets', store.s.widgets);
prefer.set('keepCw', store.s.keepCw);
prefer.set('collapseRenotes', store.s.collapseRenotes);
prefer.set('rememberNoteVisibility', store.s.rememberNoteVisibility);
prefer.set('uploadFolder', store.s.uploadFolder);
prefer.set('keepOriginalUploading', store.s.keepOriginalUploading);
prefer.set('menu', store.s.menu);
prefer.set('statusbars', store.s.statusbars);
prefer.set('pinnedUserLists', store.s.pinnedUserLists);
prefer.set('serverDisconnectedBehavior', store.s.serverDisconnectedBehavior);
prefer.set('nsfw', store.s.nsfw);
prefer.set('highlightSensitiveMedia', store.s.highlightSensitiveMedia);
prefer.set('animation', store.s.animation);
prefer.set('animatedMfm', store.s.animatedMfm);
prefer.set('advancedMfm', store.s.advancedMfm);
prefer.set('showReactionsCount', store.s.showReactionsCount);
prefer.set('enableQuickAddMfmFunction', store.s.enableQuickAddMfmFunction);
prefer.set('loadRawImages', store.s.loadRawImages);
prefer.set('imageNewTab', store.s.imageNewTab);
prefer.set('disableShowingAnimatedImages', store.s.disableShowingAnimatedImages);
prefer.set('emojiStyle', store.s.emojiStyle);
prefer.set('menuStyle', store.s.menuStyle);
prefer.set('useBlurEffectForModal', store.s.useBlurEffectForModal);
prefer.set('useBlurEffect', store.s.useBlurEffect);
prefer.set('showFixedPostForm', store.s.showFixedPostForm);
prefer.set('showFixedPostFormInChannel', store.s.showFixedPostFormInChannel);
prefer.set('enableInfiniteScroll', store.s.enableInfiniteScroll);
prefer.set('useReactionPickerForContextMenu', store.s.useReactionPickerForContextMenu);
prefer.set('showGapBetweenNotesInTimeline', store.s.showGapBetweenNotesInTimeline);
prefer.set('instanceTicker', store.s.instanceTicker);
prefer.set('emojiPickerScale', store.s.emojiPickerScale);
prefer.set('emojiPickerWidth', store.s.emojiPickerWidth);
prefer.set('emojiPickerHeight', store.s.emojiPickerHeight);
prefer.set('emojiPickerStyle', store.s.emojiPickerStyle);
prefer.set('reportError', store.s.reportError);
prefer.set('squareAvatars', store.s.squareAvatars);
prefer.set('showAvatarDecorations', store.s.showAvatarDecorations);
prefer.set('numberOfPageCache', store.s.numberOfPageCache);
prefer.set('showNoteActionsOnlyHover', store.s.showNoteActionsOnlyHover);
prefer.set('showClipButtonInNoteFooter', store.s.showClipButtonInNoteFooter);
prefer.set('reactionsDisplaySize', store.s.reactionsDisplaySize);
prefer.set('limitWidthOfReaction', store.s.limitWidthOfReaction);
prefer.set('forceShowAds', store.s.forceShowAds);
prefer.set('aiChanMode', store.s.aiChanMode);
prefer.set('devMode', store.s.devMode);
prefer.set('mediaListWithOneImageAppearance', store.s.mediaListWithOneImageAppearance);
prefer.set('notificationPosition', store.s.notificationPosition);
prefer.set('notificationStackAxis', store.s.notificationStackAxis);
prefer.set('enableCondensedLine', store.s.enableCondensedLine);
prefer.set('keepScreenOn', store.s.keepScreenOn);
prefer.set('disableStreamingTimeline', store.s.disableStreamingTimeline);
prefer.set('useGroupedNotifications', store.s.useGroupedNotifications);
prefer.set('dataSaver', store.s.dataSaver);
prefer.set('enableSeasonalScreenEffect', store.s.enableSeasonalScreenEffect);
prefer.set('enableHorizontalSwipe', store.s.enableHorizontalSwipe);
prefer.set('useNativeUiForVideoAudioPlayer', store.s.useNativeUIForVideoAudioPlayer);
prefer.set('keepOriginalFilename', store.s.keepOriginalFilename);
prefer.set('alwaysConfirmFollow', store.s.alwaysConfirmFollow);
prefer.set('confirmWhenRevealingSensitiveMedia', store.s.confirmWhenRevealingSensitiveMedia);
prefer.set('contextMenu', store.s.contextMenu);
prefer.set('skipNoteRender', store.s.skipNoteRender);
prefer.set('showSoftWordMutedWord', store.s.showSoftWordMutedWord);
prefer.set('confirmOnReact', store.s.confirmOnReact);
prefer.set('sound.masterVolume', store.s.sound_masterVolume);
prefer.set('sound.notUseSound', store.s.sound_notUseSound);
prefer.set('sound.useSoundOnlyWhenActive', store.s.sound_useSoundOnlyWhenActive);
prefer.set('sound.on.note', store.s.sound_note as any);
prefer.set('sound.on.noteMy', store.s.sound_noteMy as any);
prefer.set('sound.on.notification', store.s.sound_notification as any);
prefer.set('sound.on.reaction', store.s.sound_reaction as any);
store.set('deck.profile', deckStore.state.profile);
store.set('deck.columns', deckStore.state.columns);
store.set('deck.layout', deckStore.state.layout);
store.set('menu', []);
}

if (store.state.accountSetupWizard !== -1) {
if (store.s.accountSetupWizard !== -1) {
const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkUserSetupDialog.vue')), {}, {
closed: () => dispose(),
});
Expand Down Expand Up @@ -502,7 +502,7 @@ export async function mainBoot() {
post();
},
'd': () => {
store.set('darkMode', !store.state.darkMode);
store.set('darkMode', !store.s.darkMode);
},
's': () => {
mainRouter.push('/search');
Expand Down
6 changes: 3 additions & 3 deletions packages/frontend/src/components/MkAutocomplete.vue
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ const emojiDb = computed(() => {
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 k of keywords) {
unicodeEmojiDB.push({
Expand Down Expand Up @@ -155,7 +155,7 @@ function complete(type: string, value: any) {
emit('done', { type, value });
emit('closed');
if (type === 'emoji') {
let recents = store.state.recentlyUsedEmojis;
let recents = store.s.recentlyUsedEmojis;
recents = recents.filter((emoji: any) => emoji !== value);
recents.unshift(value);
store.set('recentlyUsedEmojis', recents.splice(0, 32));
Expand Down Expand Up @@ -238,7 +238,7 @@ function exec() {
} else if (props.type === 'emoji') {
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;
}

Expand Down
2 changes: 1 addition & 1 deletion packages/frontend/src/components/MkCaptcha.vue
Original file line number Diff line number Diff line change
Expand Up @@ -154,7 +154,7 @@ async function requestRender() {

captchaWidgetId.value = captcha.value.render(elem, {
sitekey: props.sitekey,
theme: store.state.darkMode ? 'dark' : 'light',
theme: store.s.darkMode ? 'dark' : 'light',
callback: callback,
'expired-callback': () => callback(undefined),
'error-callback': () => callback(undefined),
Expand Down
2 changes: 1 addition & 1 deletion packages/frontend/src/components/MkChart.vue
Original file line number Diff line number Diff line change
Expand Up @@ -161,7 +161,7 @@ const render = () => {
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)));

Expand Down
2 changes: 1 addition & 1 deletion packages/frontend/src/components/MkCode.core.vue
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ const props = defineProps<{
}>();

const highlighter = await getHighlighter();
const darkMode = store.reactiveState.darkMode;
const darkMode = store.r.darkMode;
const codeLang = ref<BundledLanguage | 'aiscript'>('js');

const [lightThemeName, darkThemeName] = await Promise.all([
Expand Down
10 changes: 5 additions & 5 deletions packages/frontend/src/components/MkEmojiPicker.vue
Original file line number Diff line number Diff line change
Expand Up @@ -166,7 +166,7 @@ const {
emojiPickerHeight,
} = prefer.r;

const recentlyUsedEmojis = store.reactiveState.recentlyUsedEmojis;
const recentlyUsedEmojis = store.r.recentlyUsedEmojis;

const recentlyUsedEmojisDef = computed(() => {
return recentlyUsedEmojis.value.map(getDef);
Expand Down Expand Up @@ -319,7 +319,7 @@ watch(q, () => {
}
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) {
if (keywords.every(keyword => index[emoji.char].some(k => k.includes(keyword)))) {
matches.add(emoji);
Expand All @@ -336,7 +336,7 @@ watch(q, () => {
}
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) {
if (index[emoji.char].some(k => k.startsWith(newQ))) {
matches.add(emoji);
Expand All @@ -353,7 +353,7 @@ watch(q, () => {
}
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) {
if (index[emoji.char].some(k => k.includes(newQ))) {
matches.add(emoji);
Expand Down Expand Up @@ -429,7 +429,7 @@ function chosen(emoji: string | Misskey.entities.EmojiSimple | UnicodeEmojiDef,

// 最近使った絵文字更新
if (!pinned.value?.includes(key)) {
let recents = store.state.recentlyUsedEmojis;
let recents = store.s.recentlyUsedEmojis;
recents = recents.filter((emoji) => emoji !== key);
recents.unshift(key);
store.set('recentlyUsedEmojis', recents.splice(0, 32));
Expand Down
4 changes: 2 additions & 2 deletions packages/frontend/src/components/MkFollowButton.vue
Original file line number Diff line number Diff line change
Expand Up @@ -121,11 +121,11 @@ async function onClick() {
} else {
await misskeyApi('following/create', {
userId: props.user.id,
withReplies: store.state.defaultWithReplies,
withReplies: store.s.defaultWithReplies,
});
emit('update:user', {
...props.user,
withReplies: store.state.defaultWithReplies,
withReplies: store.s.defaultWithReplies,
});
hasPendingFollowRequestFromYou.value = true;

Expand Down
2 changes: 1 addition & 1 deletion packages/frontend/src/components/MkHeatmap.vue
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ async function renderChart() {

await nextTick();

const color = store.state.darkMode ? '#b4e900' : '#86b300';
const color = store.s.darkMode ? '#b4e900' : '#86b300';

// 視覚上の分かりやすさのため上から最も大きい3つの値の平均を最大値とする
const max = values.slice().sort((a, b) => b - a).slice(0, 3).reduce((a, b) => a + b, 0) / 3;
Expand Down
8 changes: 4 additions & 4 deletions packages/frontend/src/components/MkPostForm.vue
Original file line number Diff line number Diff line change
Expand Up @@ -176,18 +176,18 @@ const text = ref(props.initialText ?? '');
const files = ref(props.initialFiles ?? []);
const poll = ref<PollEditorModelValue | null>(null);
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));
const showAddMfmFunction = ref(prefer.s.enableQuickAddMfmFunction);
watch(showAddMfmFunction, () => prefer.set('enableQuickAddMfmFunction', showAddMfmFunction.value));
const cw = ref<string | null>(props.initialCw ?? null);
const localOnly = ref(props.initialLocalOnly ?? (prefer.s.rememberNoteVisibility ? store.state.localOnly : prefer.s.defaultNoteLocalOnly));
const visibility = ref(props.initialVisibility ?? (prefer.s.rememberNoteVisibility ? store.state.visibility : prefer.s.defaultNoteVisibility));
const localOnly = ref(props.initialLocalOnly ?? (prefer.s.rememberNoteVisibility ? store.s.localOnly : prefer.s.defaultNoteLocalOnly));
const visibility = ref(props.initialVisibility ?? (prefer.s.rememberNoteVisibility ? store.s.visibility : prefer.s.defaultNoteVisibility));
const visibleUsers = ref<Misskey.entities.UserDetailed[]>([]);
if (props.initialVisibleUsers) {
props.initialVisibleUsers.forEach(u => pushVisibleUser(u));
}
const reactionAcceptance = ref(store.state.reactionAcceptance);
const reactionAcceptance = ref(store.s.reactionAcceptance);
const draghover = ref(false);
const quoteId = ref<string | null>(null);
const hasNotSpecifiedMentions = ref(false);
Expand Down
2 changes: 1 addition & 1 deletion packages/frontend/src/components/MkRetentionHeatmap.vue
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@ async function renderChart() {

await nextTick();

const color = store.state.darkMode ? '#b4e900' : '#86b300';
const color = store.s.darkMode ? '#b4e900' : '#86b300';

const getYYYYMMDD = (date: Date) => {
const y = date.getFullYear().toString().padStart(2, '0');
Expand Down
Loading

8 comments on commit 08f7e7d

@tai-cha
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

一文字略語はコメント注があってもコードの可読性が低いのであまりいいアイデアとは思えないです

@syuilo
Copy link
Member Author

@syuilo syuilo commented on 08f7e7d Mar 10, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

慣れると短い方が可読性高まるわね

@tai-cha
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

必ずしも慣れている人がコードを書くわけではないのと慣れてないと読めないコードは可読性が高いとは言えないと思います

@syuilo
Copy link
Member Author

@syuilo syuilo commented on 08f7e7d Mar 10, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

reactiveState だろうと r だろうとその概念がどういう実装でどう使うのかというのは結局学習する必要があるから、「Misskeyの実装の概念に慣れていない人がMisskeyのコードを書く」というシチュエーションはあまり想定していない

@tai-cha
Copy link
Contributor

@tai-cha tai-cha commented on 08f7e7d Mar 10, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

reactiveStateはまだその文字列から用途が推測できるので "Misskeyに" 習熟していない人でも読めるけれど、これは命名のアンチパターンだと思います(よそでも別に同じ概念はあるので理解の助けになるし、安易な略語化はコントリビュートの幅を狭める)

@syuilo
Copy link
Member Author

@syuilo syuilo commented on 08f7e7d Mar 10, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

慣れている場合の可読性・書きやすさを重視してこれでいきます
あと安易ではないです

@syuilo
Copy link
Member Author

@syuilo syuilo commented on 08f7e7d Mar 10, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ちなみに頻出するワードを略す(糖衣構文)のは他でもよくある

例:
Vueの h -> createVDOM の略、: → bind の糖衣構文

@tai-cha
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

そういった意図があるのであれば納得と承諾はします

なぜこの変更がバッドプラクティスだと考えていたかを、念のため落ち着いて再考したうえで書いておきます(後学のためと、判断材料として)

  • Vue.jsのh()は特殊なケースであり、今回のstore.s, rのような省略とは状況が異なります。h()はレンダー関数のみで頻繁に使用されるものであり、hyperscriptの略としてコミュニティに浸透しています。
    • また、Vue.jsのパフォーマンスを優先する設計思想にも合致している
      • misskeyの場合はコード最適化が入るのでそこは問題ではない
  • storeの状態はアプリケーション全体で参照され、可読性が重要
    • :はあくまで接頭辞、h()はレンダー関数としてのみ使用
    • vuexでもstore.state, store.mutations, store.actionsなどが用いられている
    • フロントエンドのコードの非常に広範囲で用いる

Please sign in to comment.