keith/barkey
1
0
Fork 0
mirror of https://codeberg.org/yeentown/barkey synced 2024-11-26 02:55:30 +00:00
Code Issues Projects Releases Packages Wiki Activity

upd: add switching between notes, notes with replies and notes with media on user page

Browse source
This commit is contained in:
Mar0xy 2023-09-22 17:47:33 +02:00
parent 7b79658dbd
commit e6966ac9c8
No known key found for this signature in database
GPG key ID: 56569BBE47D2C828
1 changed files with 17 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
packages/frontend/src/pages/user/home.vue
View file

@ -131,18 +131,18 @@ SPDX-License-Identifier: AGPL-3.0-only
<XPhotos :key="user.id" :user="user"/> <XPhotos :key="user.id" :user="user"/>
<XActivity :key="user.id" :user="user"/> <XActivity :key="user.id" :user="user"/>
</template> </template>
<MkTab v-model="noteview" :class="$style.tab">
<option :value="null">{{ i18n.ts.notes }}</option>
<option value="replies">{{ i18n.ts.notesAndReplies }}</option>
<option value="files">{{ i18n.ts.withFiles }}</option>
</MkTab>
<MkNotes v-if="!disableNotes" :class="$style.tl" :noGap="true" :pagination="pagination"/> <MkNotes v-if="!disableNotes" :class="$style.tl" :noGap="true" :pagination="pagination"/>
</div> </div>
</div> </div>
<div v-if="!narrow" class="sub _gaps" style="container-type: inline-size;"> <div v-if="!narrow" class="sub _gaps" style="container-type: inline-size;">
<XPhotos :key="user.id" :user="user"/> <XPhotos :key="user.id" :user="user"/>
<XActivity :key="user.id" :user="user"/> <XActivity :key="user.id" :user="user"/>
<XListenBrainz <XListenBrainz v-if="user.listenbrainz && listenbrainzdata" :key="user.id" :user="user"/>
v-if="user.listenbrainz && listenbrainzdata"
:key="user.id"
:user="user"
style="margin-top: var(--margin)"
/>
</div> </div>
</div> </div>
</MkSpacer> </MkSpacer>
@ -151,6 +151,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup> <script lang="ts" setup>
import { defineAsyncComponent, computed, onMounted, onUnmounted, nextTick, watch } from 'vue'; import { defineAsyncComponent, computed, onMounted, onUnmounted, nextTick, watch } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import MkTab from '@/components/MkTab.vue';
import MkNote from '@/components/MkNote.vue'; import MkNote from '@/components/MkNote.vue';
import MkFollowButton from '@/components/MkFollowButton.vue'; import MkFollowButton from '@/components/MkFollowButton.vue';
import MkAccountMoved from '@/components/MkAccountMoved.vue'; import MkAccountMoved from '@/components/MkAccountMoved.vue';
@ -172,6 +173,7 @@ import { confetti } from '@/scripts/confetti.js';
import MkNotes from '@/components/MkNotes.vue'; import MkNotes from '@/components/MkNotes.vue';
import { api } from '@/os.js'; import { api } from '@/os.js';
import { isFfVisibleForMe } from '@/scripts/isFfVisibleForMe.js'; import { isFfVisibleForMe } from '@/scripts/isFfVisibleForMe.js';
function calcAge(birthdate: string): number { function calcAge(birthdate: string): number {
const date = new Date(birthdate); const date = new Date(birthdate);
const now = new Date(); const now = new Date();
@ -210,6 +212,7 @@ let memoDraft = $ref(props.user.memo);
let isEditingMemo = $ref(false); let isEditingMemo = $ref(false);
let moderationNote = $ref(props.user.moderationNote); let moderationNote = $ref(props.user.moderationNote);
let editModerationNote = $ref(false); let editModerationNote = $ref(false);
let noteview = $ref<string | null>(null);
let listenbrainzdata = false; let listenbrainzdata = false;
if (props.user.listenbrainz) { if (props.user.listenbrainz) {
@ -238,6 +241,8 @@ const pagination = {
limit: 10, limit: 10,
params: computed(() => ({ params: computed(() => ({
userId: props.user.id, userId: props.user.id,
includeReplies: noteview === 'replies' || noteview === 'files',
withFiles: noteview === 'files',
})), })),
}; };
@ -337,6 +342,12 @@ onUnmounted(() => {
padding: 16px; padding: 16px;
} }
> .tab {
margin: calc(var(--margin) / 2) 0;
padding: calc(var(--margin) / 2) 0;
background: var(--bg);
}
> .profile { > .profile {
> .main { > .main {