refactor(frontend): better type defs
This commit is contained in:
parent
74c857e23d
commit
e4db9b64df
|
@ -31,7 +31,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</MkPagination>
|
</MkPagination>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup generic="T extends PagingCtx<'notes/mentions'>">
|
||||||
import { useTemplateRef } from 'vue';
|
import { useTemplateRef } from 'vue';
|
||||||
import type { PagingCtx } from '@/composables/use-pagination.js';
|
import type { PagingCtx } from '@/composables/use-pagination.js';
|
||||||
import MkNote from '@/components/MkNote.vue';
|
import MkNote from '@/components/MkNote.vue';
|
||||||
|
@ -41,7 +41,7 @@ import { globalEvents, useGlobalEvent } from '@/events.js';
|
||||||
import { isSeparatorNeeded, getSeparatorInfo } from '@/utility/timeline-date-separate.js';
|
import { isSeparatorNeeded, getSeparatorInfo } from '@/utility/timeline-date-separate.js';
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{
|
const props = withDefaults(defineProps<{
|
||||||
pagination: PagingCtx;
|
pagination: T;
|
||||||
noGap?: boolean;
|
noGap?: boolean;
|
||||||
disableAutoLoad?: boolean;
|
disableAutoLoad?: boolean;
|
||||||
pullToRefresh?: boolean;
|
pullToRefresh?: boolean;
|
||||||
|
|
|
@ -40,16 +40,19 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</component>
|
</component>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup generic="T extends PagingCtx">
|
||||||
import type { PagingCtx } from '@/composables/use-pagination.js';
|
import type { PagingCtx } from '@/composables/use-pagination.js';
|
||||||
|
import type { UnwrapRef } from 'vue';
|
||||||
import MkButton from '@/components/MkButton.vue';
|
import MkButton from '@/components/MkButton.vue';
|
||||||
import { i18n } from '@/i18n.js';
|
import { i18n } from '@/i18n.js';
|
||||||
import { prefer } from '@/preferences.js';
|
import { prefer } from '@/preferences.js';
|
||||||
import { usePagination } from '@/composables/use-pagination.js';
|
import { usePagination } from '@/composables/use-pagination.js';
|
||||||
import MkPullToRefresh from '@/components/MkPullToRefresh.vue';
|
import MkPullToRefresh from '@/components/MkPullToRefresh.vue';
|
||||||
|
|
||||||
|
type Paginator = ReturnType<typeof usePagination<T['endpoint']>>;
|
||||||
|
|
||||||
const props = withDefaults(defineProps<{
|
const props = withDefaults(defineProps<{
|
||||||
pagination: PagingCtx;
|
pagination: T;
|
||||||
disableAutoLoad?: boolean;
|
disableAutoLoad?: boolean;
|
||||||
displayLimit?: number;
|
displayLimit?: number;
|
||||||
pullToRefresh?: boolean;
|
pullToRefresh?: boolean;
|
||||||
|
@ -58,7 +61,7 @@ const props = withDefaults(defineProps<{
|
||||||
pullToRefresh: true,
|
pullToRefresh: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
const paginator = usePagination({
|
const paginator: Paginator = usePagination({
|
||||||
ctx: props.pagination,
|
ctx: props.pagination,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -70,6 +73,11 @@ function appearFetchMore() {
|
||||||
paginator.fetchOlder();
|
paginator.fetchOlder();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
defineSlots<{
|
||||||
|
empty: () => void;
|
||||||
|
default: (props: { items: UnwrapRef<Paginator['items']> }) => void;
|
||||||
|
}>();
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
paginator: paginator,
|
paginator: paginator,
|
||||||
});
|
});
|
||||||
|
|
|
@ -40,7 +40,7 @@ export type PagingCtx<E extends keyof Misskey.Endpoints = keyof Misskey.Endpoint
|
||||||
canFetchDetection?: 'safe' | 'limit';
|
canFetchDetection?: 'safe' | 'limit';
|
||||||
};
|
};
|
||||||
|
|
||||||
export function usePagination<Endpoint extends keyof Misskey.Endpoints, T = Misskey.Endpoints[Endpoint]['res'] extends (infer I)[] ? I : never>(props: {
|
export function usePagination<Endpoint extends keyof Misskey.Endpoints, T extends { id: string; } = (Misskey.Endpoints[Endpoint]['res'] extends (infer I)[] ? I extends { id: string } ? I : { id: string } : { id: string })>(props: {
|
||||||
ctx: PagingCtx<Endpoint>;
|
ctx: PagingCtx<Endpoint>;
|
||||||
autoInit?: boolean;
|
autoInit?: boolean;
|
||||||
autoReInit?: boolean;
|
autoReInit?: boolean;
|
||||||
|
|
Loading…
Reference in New Issue