mirror of
https://activitypub.software/TransFem-org/Sharkey
synced 2024-11-24 06:55:12 +00:00
remove idea
section
This commit is contained in:
parent
1c181df086
commit
a15e5c52f4
3 changed files with 0 additions and 281 deletions
|
@ -1,88 +0,0 @@
|
||||||
<!--
|
|
||||||
SPDX-FileCopyrightText: hazelnoot and other Sharkey contributors
|
|
||||||
SPDX-License-Identifier: AGPL-3.0-only
|
|
||||||
-->
|
|
||||||
|
|
||||||
<!--
|
|
||||||
Important note: this is a generic component.
|
|
||||||
Some operations require Vue helpers to satisfy typescript.
|
|
||||||
See this page for more information: https://vuejs.org/api/sfc-script-setup.html#generics
|
|
||||||
-->
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<MkPagination ref="mkPagination" :pagination="pagination" :disableAutoload="disableAutoLoad" :displayLimit="computedDisplayLimit">
|
|
||||||
<template #empty>
|
|
||||||
<slot name="empty">
|
|
||||||
<div class="_fullinfo">
|
|
||||||
<img :src="noContentImage ?? infoImageUrl" class="_ghost" :alt="noContentText" aria-hidden="true"/>
|
|
||||||
<div>{{ noContentText }}</div>
|
|
||||||
</div>
|
|
||||||
</slot>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #default="{ items }">
|
|
||||||
<slot :items="items as Response"></slot>
|
|
||||||
</template>
|
|
||||||
</MkPagination>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
export type { Paging } from '@/components/MkPagination.vue';
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script setup lang="ts" generic="Endpoint extends keyof Endpoints">
|
|
||||||
import { computed, shallowRef } from 'vue';
|
|
||||||
import type { Endpoints } from 'misskey-js';
|
|
||||||
import type { SwitchCaseResponseType } from 'misskey-js/built/api.types.js';
|
|
||||||
import type { ComponentExposed } from 'vue-component-type-helpers';
|
|
||||||
import { infoImageUrl } from '@/instance.js';
|
|
||||||
import { i18n } from '@/i18n.js';
|
|
||||||
import MkPagination, { Paging } from '@/components/MkPagination.vue';
|
|
||||||
import { MisskeyEntity } from '@/types/date-separated-list.js';
|
|
||||||
|
|
||||||
type Response = SwitchCaseResponseType<Endpoint, Endpoints[Endpoint]['req']> & MisskeyEntity[];
|
|
||||||
type Entity = Response[number];
|
|
||||||
|
|
||||||
const mkPagination = shallowRef<InstanceType<typeof MkPagination>>();
|
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{
|
|
||||||
pagination: Paging<Endpoint>;
|
|
||||||
disableAutoLoad?: boolean;
|
|
||||||
displayLimit?: number | null;
|
|
||||||
noContentText?: string;
|
|
||||||
noContentImage?: string;
|
|
||||||
}>(), {
|
|
||||||
disableAutoLoad: false,
|
|
||||||
displayLimit: undefined,
|
|
||||||
noContentText: i18n.ts.noNotes,
|
|
||||||
noContentImage: undefined,
|
|
||||||
});
|
|
||||||
|
|
||||||
// Value of displayLimit with default value applied.
|
|
||||||
const computedDisplayLimit = computed(() => {
|
|
||||||
// undefined (default) means to use the value from paging.
|
|
||||||
if (props.displayLimit === undefined) {
|
|
||||||
return props.pagination.limit;
|
|
||||||
}
|
|
||||||
|
|
||||||
// number means to use that value.
|
|
||||||
// null means to use the default from MkPagination.
|
|
||||||
return props.displayLimit ?? undefined;
|
|
||||||
});
|
|
||||||
|
|
||||||
/* eslint-disable @typescript-eslint/no-non-null-assertion */
|
|
||||||
defineExpose({
|
|
||||||
// Expose all the same properties...
|
|
||||||
...mkPagination.value!,
|
|
||||||
|
|
||||||
// But override these to have a narrower type.
|
|
||||||
items: mkPagination.value!.items as Map<string, Entity> | undefined,
|
|
||||||
queue: mkPagination.value!.queue as Map<string, Entity> | undefined,
|
|
||||||
prepend: (item: Entity) => mkPagination.value!.prepend(item),
|
|
||||||
append: (item: Entity) => mkPagination.value!.append(item),
|
|
||||||
updateItem: (id: Entity['id'], replacer: (old: Entity) => Entity) => {
|
|
||||||
return mkPagination.value!.updateItem(id, old => replacer(old as Entity));
|
|
||||||
},
|
|
||||||
});
|
|
||||||
/* eslint-enable @typescript-eslint/no-non-null-assertion */
|
|
||||||
</script>
|
|
|
@ -1,84 +0,0 @@
|
||||||
<!--
|
|
||||||
SPDX-FileCopyrightText: hazelnoot and other Sharkey contributors
|
|
||||||
SPDX-License-Identifier: AGPL-3.0-only
|
|
||||||
-->
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div :class="$style.tabstrip">
|
|
||||||
<button
|
|
||||||
v-for="tab of tabs"
|
|
||||||
:key="tab.key"
|
|
||||||
:disabled="modelValue === tab.key"
|
|
||||||
:class="{ [$style.button]: true, [$style.active]: modelValue === tab.key }"
|
|
||||||
class="_button"
|
|
||||||
click-anime
|
|
||||||
@click="emit('update:modelValue', tab.key)"
|
|
||||||
>
|
|
||||||
{{ tab.label ?? tab.key }}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts">
|
|
||||||
export interface Tab {
|
|
||||||
key: string;
|
|
||||||
label?: string;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
defineProps<{
|
|
||||||
modelValue: string;
|
|
||||||
tabs: Tab[];
|
|
||||||
}>();
|
|
||||||
const emit = defineEmits<{
|
|
||||||
(ev: 'update:modelValue', v: string): void;
|
|
||||||
}>();
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style module lang="scss">
|
|
||||||
.tabstrip {
|
|
||||||
display: flex;
|
|
||||||
font-size: 90%;
|
|
||||||
|
|
||||||
padding: calc(var(--margin) / 2) 0;
|
|
||||||
background: color-mix(in srgb, var(--bg) 65%, transparent);
|
|
||||||
backdrop-filter: var(--blur, blur(15px));
|
|
||||||
border-radius: var(--radius-sm);
|
|
||||||
|
|
||||||
> * {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
padding: 10px 8px;
|
|
||||||
margin-left: 0.4rem;
|
|
||||||
margin-right: 0.4rem;
|
|
||||||
border-radius: var(--radius-sm);
|
|
||||||
|
|
||||||
&:disabled {
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
color: var(--accent);
|
|
||||||
background: var(--accentedBg);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:not(.active):hover {
|
|
||||||
color: var(--fgHighlighted);
|
|
||||||
background: var(--panelHighlight);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:not(:first-child) {
|
|
||||||
margin-left: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@container (max-width: 500px) {
|
|
||||||
.tabstrip {
|
|
||||||
font-size: 80%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -1,109 +0,0 @@
|
||||||
<!--
|
|
||||||
SPDX-FileCopyrightText: syuilo and misskey-project
|
|
||||||
SPDX-License-Identifier: AGPL-3.0-only
|
|
||||||
-->
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<MkStickyContainer>
|
|
||||||
<template #header>
|
|
||||||
<SkTab v-model="tab" :tabs="tabs"/>
|
|
||||||
</template>
|
|
||||||
<MkLazy>
|
|
||||||
<div v-if="tab === 'pinned'" class="_gaps">
|
|
||||||
<div v-if="user.pinnedNotes.length < 1" class="_fullinfo">
|
|
||||||
<img :src="infoImageUrl" class="_ghost" aria-hidden="true" :alt="i18n.ts.noNotes"/>
|
|
||||||
<div>{{ i18n.ts.noNotes }}</div>
|
|
||||||
</div>
|
|
||||||
<div v-else class="_panel">
|
|
||||||
<MkNote v-for="note of user.pinnedNotes" :key="note.id" class="note" :class="$style.pinnedNote" :note="note" :pinned="true"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<MkNotes v-else :class="$style.tl" :noGap="true" :pagination="pagination"/>
|
|
||||||
</MkLazy>
|
|
||||||
</MkStickyContainer>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
import { ref, computed, defineAsyncComponent } from 'vue';
|
|
||||||
import * as Misskey from 'misskey-js';
|
|
||||||
import MkNotes from '@/components/MkNotes.vue';
|
|
||||||
import SkTab from '@/components/SkTab.vue';
|
|
||||||
import { i18n } from '@/i18n.js';
|
|
||||||
import { infoImageUrl } from '@/instance.js';
|
|
||||||
import { Paging } from '@/components/MkPagination.vue';
|
|
||||||
import { Tab } from '@/components/SkTab.vue';
|
|
||||||
import { defaultStore } from '@/store.js';
|
|
||||||
|
|
||||||
const MkNote = defineAsyncComponent(() => defaultStore.state.noteDesign === 'sharkey' ? import('@/components/SkNote.vue') : import('@/components/MkNote.vue'));
|
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{
|
|
||||||
user: Misskey.entities.UserDetailed;
|
|
||||||
includeFeatured: boolean;
|
|
||||||
includePinned: boolean;
|
|
||||||
}>(), {
|
|
||||||
includeFeatured: true,
|
|
||||||
includePinned: true,
|
|
||||||
});
|
|
||||||
|
|
||||||
const tab = ref<string | null>('notes');
|
|
||||||
|
|
||||||
const tabs = computed(() => {
|
|
||||||
const t: Tab[] = [
|
|
||||||
{ key: 'notes', label: i18n.ts.notes },
|
|
||||||
{ key: 'all', label: i18n.ts.all },
|
|
||||||
{ key: 'files', label: i18n.ts.withFiles },
|
|
||||||
];
|
|
||||||
|
|
||||||
if (props.includeFeatured) {
|
|
||||||
t.unshift({
|
|
||||||
key: 'featured',
|
|
||||||
label: i18n.ts.featured,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (props.includePinned) {
|
|
||||||
t.unshift({
|
|
||||||
key: 'pinned',
|
|
||||||
label: i18n.ts.pinnedOnly,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
return t;
|
|
||||||
});
|
|
||||||
|
|
||||||
const pagination = computed(() => {
|
|
||||||
if (tab.value === 'featured') {
|
|
||||||
return {
|
|
||||||
endpoint: 'users/featured-notes' as const,
|
|
||||||
limit: 10,
|
|
||||||
params: {
|
|
||||||
userId: props.user.id,
|
|
||||||
},
|
|
||||||
} satisfies Paging<'users/featured-notes'>;
|
|
||||||
} else {
|
|
||||||
return {
|
|
||||||
endpoint: 'users/notes' as const,
|
|
||||||
limit: 10,
|
|
||||||
params: {
|
|
||||||
userId: props.user.id,
|
|
||||||
withRenotes: tab.value === 'all',
|
|
||||||
withReplies: tab.value === 'all',
|
|
||||||
withChannelNotes: tab.value === 'all',
|
|
||||||
withFiles: tab.value === 'files',
|
|
||||||
},
|
|
||||||
} satisfies Paging<'users/notes'>;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style module lang="scss">
|
|
||||||
.tl {
|
|
||||||
background: var(--bg);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
overflow: clip;
|
|
||||||
}
|
|
||||||
|
|
||||||
.pinnedNote:not(:last-child) {
|
|
||||||
border-bottom: solid 0.5px var(--divider);
|
|
||||||
}
|
|
||||||
</style>
|
|
Loading…
Reference in a new issue