diff --git a/locales/ja.yml b/locales/ja.yml index fad0c89113..75ff13afef 100644 --- a/locales/ja.yml +++ b/locales/ja.yml @@ -598,6 +598,7 @@ desktop/views/components/ui.header.account.vue: drive: "ドライブ" favorites: "お気に入り" lists: "リスト" + follow-requests: "フォロー申請" customize: "カスタマイズ" settings: "設定" signout: "サインアウト" @@ -617,7 +618,13 @@ desktop/views/components/ui.header.post.vue: desktop/views/components/ui.header.search.vue: placeholder: "検索" +desktop/views/components/follow-requests-window.vue: + title: "フォロー申請" + accept: "許可" + reject: "拒否" + desktop/views/components/user-lists-window.vue: + title: "リスト" create-list: "リストを作成" desktop/views/components/user-preview.vue: diff --git a/src/client/app/desktop/views/components/follow-requests-window.vue b/src/client/app/desktop/views/components/follow-requests-window.vue new file mode 100644 index 0000000000..c864f1f9cd --- /dev/null +++ b/src/client/app/desktop/views/components/follow-requests-window.vue @@ -0,0 +1,54 @@ +<template> +<mk-window ref="window" is-modal width="450px" height="500px" @closed="$destroy"> + <span slot="header">%fa:envelope R% %i18n:@title%</span> + + <div data-id="c1136cec-1278-49b1-9ea7-412c1ef794f4" :data-darkmode="$store.state.device.darkmode"> + <router-link v-for="req in requests" :key="req.id" :to="req.followee | userPage">{{ req.followee | userName }}</router-link> + </div> +</mk-window> +</template> + +<script lang="ts"> +import Vue from 'vue'; +export default Vue.extend({ + data() { + return { + fetching: true, + requests: [] + }; + }, + mounted() { + (this as any).api('following/requests/list').then(requests => { + this.fetching = false; + this.requests = requests; + }); + }, + methods: { + close() { + (this as any).$refs.window.close(); + } + } +}); +</script> + +<style lang="stylus" scoped> + +root(isDark) + padding 16px + + > button + margin-bottom 16px + + > a + display block + padding 16px + border solid 1px isDark ? #1c2023 : #eee + border-radius 4px + +[data-id="c1136cec-1278-49b1-9ea7-412c1ef794f4"][data-darkmode] + root(true) + +[data-id="c1136cec-1278-49b1-9ea7-412c1ef794f4"]:not([data-darkmode]) + root(false) + +</style> diff --git a/src/client/app/desktop/views/components/ui.header.account.vue b/src/client/app/desktop/views/components/ui.header.account.vue index 8d26691f84..d110d700a0 100644 --- a/src/client/app/desktop/views/components/ui.header.account.vue +++ b/src/client/app/desktop/views/components/ui.header.account.vue @@ -19,6 +19,9 @@ <li @click="list"> <p>%fa:list%<span>%i18n:@lists%</span>%fa:angle-right%</p> </li> + <li @click="followRequests" v-if="$store.state.i.isLocked"> + <p>%fa:envelope R%<span>%i18n:@follow-requests%<i v-if="$store.state.i.pendingReceivedFollowRequestsCount">{{ $store.state.i.pendingReceivedFollowRequestsCount }}</i></span>%fa:angle-right%</p> + </li> </ul> <ul> <li> @@ -46,6 +49,7 @@ <script lang="ts"> import Vue from 'vue'; import MkUserListsWindow from './user-lists-window.vue'; +import MkFollowRequestsWindow from './follow-requests-window.vue'; import MkSettingsWindow from './settings-window.vue'; import MkDriveWindow from './drive-window.vue'; import contains from '../../../common/scripts/contains'; @@ -91,6 +95,10 @@ export default Vue.extend({ this.$router.push(`i/lists/${ list.id }`); }); }, + followRequests() { + this.close(); + (this as any).os.new(MkFollowRequestsWindow); + }, settings() { this.close(); (this as any).os.new(MkSettingsWindow); @@ -225,6 +233,15 @@ root(isDark) > span:first-child padding-left 22px + > span:nth-child(2) + > i + margin-left 4px + padding 2px 8px + font-size 90% + background $theme-color + color $theme-color-foreground + border-radius 8px + > [data-fa]:first-child margin-right 6px width 16px diff --git a/src/client/app/desktop/views/components/user-lists-window.vue b/src/client/app/desktop/views/components/user-lists-window.vue index 454c725d20..109d1695d8 100644 --- a/src/client/app/desktop/views/components/user-lists-window.vue +++ b/src/client/app/desktop/views/components/user-lists-window.vue @@ -1,6 +1,6 @@ <template> <mk-window ref="window" is-modal width="450px" height="500px" @closed="$destroy"> - <span slot="header">%fa:list% リスト</span> + <span slot="header">%fa:list% %i18n:@title%</span> <div data-id="6e4caea3-d8f9-4ab7-96de-ab67fe8d5c82" :data-darkmode="$store.state.device.darkmode"> <button class="ui" @click="add">%i18n:@create-list%</button> diff --git a/src/models/follow-request.ts b/src/models/follow-request.ts index 0cdb8b4f47..eea5d1c535 100644 --- a/src/models/follow-request.ts +++ b/src/models/follow-request.ts @@ -78,10 +78,10 @@ export const pack = ( delete _request._id; // Populate follower - _request.followerId = await packUser(_request.followerId, me); + _request.follower = await packUser(_request.followerId, me); // Populate followee - _request.followeeId = await packUser(_request.followeeId, me); + _request.followee = await packUser(_request.followeeId, me); resolve(_request); });