diff --git a/packages/frontend/src/components/MkFollowButton.vue b/packages/frontend/src/components/MkFollowButton.vue
index a96da68e4f..0c92a9dd99 100644
--- a/packages/frontend/src/components/MkFollowButton.vue
+++ b/packages/frontend/src/components/MkFollowButton.vue
@@ -37,6 +37,7 @@ import { useStream } from '@/stream';
import { i18n } from '@/i18n';
import { claimAchievement } from '@/scripts/achievements';
import { $i } from '@/account';
+import {userName} from "@/filters/user";
const props = withDefaults(defineProps<{
user: Misskey.entities.UserDetailed,
@@ -73,7 +74,7 @@ async function onClick() {
if (isFollowing) {
const { canceled } = await os.confirm({
type: 'warning',
- text: i18n.t('unfollowConfirm', { name: props.user.name || props.user.username }),
+ text: i18n.t('unfollowConfirm', { name: userName(props.user) }),
});
if (canceled) return;
diff --git a/packages/frontend/src/components/global/MkUserName.vue b/packages/frontend/src/components/global/MkUserName.vue
index 2b2a155039..a53f7c0dd8 100644
--- a/packages/frontend/src/components/global/MkUserName.vue
+++ b/packages/frontend/src/components/global/MkUserName.vue
@@ -1,10 +1,11 @@
-
+
diff --git a/packages/frontend/src/pages/user/home.vue b/packages/frontend/src/pages/user/home.vue
index 26349e3393..4f4d2f75a4 100644
--- a/packages/frontend/src/pages/user/home.vue
+++ b/packages/frontend/src/pages/user/home.vue
@@ -15,7 +15,12 @@
-
+
+
+
+
@@ -185,6 +190,7 @@ import { api } from '@/os';
import { isFfVisibility } from '@/scripts/is-ff-visibility';
import { defaultStore } from '@/store';
import { miLocalStorage } from '@/local-storage';
+import { editNickname } from '@/scripts/edit-nickname';
const XPhotos = defineAsyncComponent(() => import('./index.photos.vue'));
const XActivity = defineAsyncComponent(() => import('./index.activity.vue'));
@@ -409,12 +415,25 @@ onUnmounted(() => {
color: #fff;
> .name {
- display: block;
+ display: flex;
+ gap: 8px;
margin: 0;
line-height: 32px;
font-weight: bold;
font-size: 1.8em;
text-shadow: 0 0 8px #000;
+
+ > .nickname-button {
+ -webkit-backdrop-filter: var(--blur, blur(8px));
+ backdrop-filter: var(--blur, blur(8px));
+ background: rgba(0, 0, 0, 0.2);
+ color: #ccc;
+ font-size: 0.7em;
+ line-height: 1;
+ width: 1.8em;
+ height: 1.8em;
+ border-radius: 100%;
+ }
}
> .bottom {
@@ -607,7 +626,7 @@ onUnmounted(() => {
font-size: 70%;
}
}
-
+
>div {
flex: 1;
text-align: center;
diff --git a/packages/frontend/src/scripts/edit-nickname.ts b/packages/frontend/src/scripts/edit-nickname.ts
new file mode 100644
index 0000000000..fadfc27cee
--- /dev/null
+++ b/packages/frontend/src/scripts/edit-nickname.ts
@@ -0,0 +1,19 @@
+import {User} from "misskey-js/built/entities";
+import {defaultStore} from "@/store";
+import * as os from '@/os';
+
+export async function editNickname(user: User) {
+ const { result, canceled } = await os.inputText({
+ title: 'ニックネームを編集',
+ placeholder: user.name || user.username,
+ default: defaultStore.state.nicknameMap[user.id] ?? null,
+ });
+ if (canceled) return
+ const newMap = {...defaultStore.state.nicknameMap};
+ if (result) {
+ newMap[user.id] = result;
+ } else {
+ delete newMap[user.id];
+ }
+ await defaultStore.set('nicknameMap', newMap);
+}
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 6b83852a8c..0e86e56139 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -376,6 +376,15 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device',
default: false,
},
+ nicknameEnabled: {
+ where: 'account',
+ default: true,
+ },
+ nicknameMap: {
+ where: 'account',
+ default: {} as Record,
+ },
+ // #endregion
}));
// TODO: 他のタブと永続化されたstateを同期