fix type errors of channel

packages/client/src/components/MkChannelFollowButton.vue

@@ -27,10 +27,11 @@ import { ref } from "vue";
 import * as os from "@/os";
 import { i18n } from "@/i18n";
 import icon from "@/scripts/icon";
+import type { entities } from "firefish-js";
 
 const props = withDefaults(
 	defineProps<{
-		channel: Record<string, any>;
+		channel: entities.Channel;
 		full?: boolean;
 	}>(),
 	{
@@ -38,7 +39,7 @@ const props = withDefaults(
 	},
 );
 
-const isFollowing = ref<boolean>(props.channel.isFollowing);
+const isFollowing = ref<boolean>(props.channel.isFollowing ?? false);
 const wait = ref(false);
 
 async function onClick() {

packages/client/src/components/MkChannelList.vue

@@ -11,7 +11,7 @@
 			</div>
 		</template>
 
-		<template #default="{ items }">
+		<template #default="{ items }: { items: entities.Channel[] }">
 			<MkChannelPreview
 				v-for="item in items"
 				:key="item.id"
@@ -29,14 +29,15 @@ import MkPagination from "@/components/MkPagination.vue";
 import { i18n } from "@/i18n";
 import type { entities } from "firefish-js";
 
-const props = withDefaults(
+withDefaults(
 	defineProps<{
 		pagination: PagingOf<entities.Channel>;
 		noGap?: boolean;
-		extractor?: (item: any) => any;
+		// TODO: this function is not used and may can be removed
+		extractor?: (item: entities.Channel) => entities.Channel;
 	}>(),
 	{
-		extractor: (item) => item,
+		extractor: (item: entities.Channel) => item,
 	},
 );
 </script>

packages/client/src/components/MkChannelPreview.vue

@@ -54,9 +54,10 @@
 import { computed } from "vue";
 import { i18n } from "@/i18n";
 import icon from "@/scripts/icon";
+import type { entities } from "firefish-js";
 
 const props = defineProps<{
-	channel: Record<string, any>;
+	channel: entities.Channel;
 }>();
 
 const bannerStyle = computed(() => {

packages/client/src/components/MkPostForm.vue

@@ -354,7 +354,7 @@ const props = withDefaults(
 	defineProps<{
 		reply?: entities.Note;
 		renote?: entities.Note;
-		channel?: any; // TODO
+		channel?: entities.Channel;
 		mention?: entities.User;
 		specified?: entities.User;
 		initialText?: string;

packages/client/src/components/MkPostFormDialog.vue

@@ -28,7 +28,7 @@ import MkPostForm from "@/components/MkPostForm.vue";
 const props = defineProps<{
 	reply?: entities.Note;
 	renote?: entities.Note;
-	channel?: any; // TODO
+	channel?: entities.Channel;
 	mention?: entities.User;
 	specified?: entities.User;
 	initialText?: string;

packages/client/src/pages/channel.vue

@@ -33,7 +33,7 @@
 						:style="{
 							backgroundImage: channel.bannerUrl
 								? `url(${channel.bannerUrl})`
-								: null,
+								: undefined,
 						}"
 						class="banner"
 					>
@@ -88,8 +88,6 @@
 					class="_gap"
 					src="channel"
 					:channel="channelId"
-					@before="before"
-					@after="after"
 				/>
 			</div>
 		</MkSpacer>
@@ -107,6 +105,7 @@ import { me } from "@/me";
 import { i18n } from "@/i18n";
 import { definePageMetadata } from "@/scripts/page-metadata";
 import icon from "@/scripts/icon";
+import type { entities } from "firefish-js";
 
 const router = useRouter();
 
@@ -114,7 +113,11 @@ const props = defineProps<{
 	channelId: string;
 }>();
 
-const channel = ref(null);
+const channel = ref<entities.Channel>(
+	await os.api("channels/show", {
+		channelId: props.channelId,
+	}),
+);
 const showBanner = ref(true);
 
 watch(
@@ -124,7 +127,6 @@ watch(
 			channelId: props.channelId,
 		});
 	},
-	{ immediate: true },
 );
 
 function edit() {

packages/client/src/pages/channels.vue

@@ -125,6 +125,7 @@ import { defaultStore } from "@/store";
 import icon from "@/scripts/icon";
 import "swiper/scss";
 import "swiper/scss/virtual";
+import type { Swiper as SwiperType } from "swiper/types";
 
 const router = useRouter();
 
@@ -216,18 +217,18 @@ definePageMetadata(
 	})),
 );
 
-let swiperRef = null;
+let swiperRef: SwiperType | null = null;
 
-function setSwiperRef(swiper) {
+function setSwiperRef(swiper: SwiperType) {
 	swiperRef = swiper;
 	syncSlide(tabs.indexOf(tab.value));
 }
 
 function onSlideChange() {
-	tab.value = tabs[swiperRef.activeIndex];
+	tab.value = tabs[swiperRef!.activeIndex];
 }
 
-function syncSlide(index) {
+function syncSlide(index: number) {
-	swiperRef.slideTo(index);
+	swiperRef!.slideTo(index);
 }
 </script>

packages/firefish-js/src/api.types.ts

@@ -218,16 +218,31 @@ export type Endpoints = {
 	};
 
 	// channels
-	"channels/create": { req: TODO; res: TODO };
+	"channels/create": {
-	"channels/featured": { req: TODO; res: TODO };
+		req: {
+			name: string;
+			description?: string;
+			bannerId: DriveFile["id"] | null;
+		};
+		res: Channel;
+	};
+	"channels/featured": { req: TODO; res: Channel[] };
 	"channels/follow": { req: TODO; res: TODO };
-	"channels/followed": { req: TODO; res: TODO };
+	"channels/followed": { req: TODO; res: Channel[] };
-	"channels/owned": { req: TODO; res: TODO };
+	"channels/owned": { req: TODO; res: Channel[] };
 	"channels/pin-note": { req: TODO; res: TODO };
-	"channels/show": { req: TODO; res: TODO };
+	"channels/show": { req: TODO; res: Channel };
 	"channels/timeline": { req: TODO; res: Note[] };
 	"channels/unfollow": { req: TODO; res: TODO };
-	"channels/update": { req: TODO; res: TODO };
+	"channels/update": {
+		req: {
+			channelId: Channel["id"];
+			name: string;
+			description?: string;
+			bannerId: DriveFile["id"] | null;
+		};
+		res: Channel;
+	};
 
 	// charts
 	"charts/active-users": {

packages/firefish-js/src/entities.ts

@@ -471,8 +471,17 @@ export type FollowRequest = {
 
 export type Channel = {
 	id: ID;
+	createdAt: DateString;
+	lastNotedAt: DateString | null;
 	name: string;
-	// TODO
+	description: string | null;
+	bannerId: DriveFile["id"];
+	bannerUrl: string | null;
+	notesCount: number;
+	usersCount: number;
+	isFollowing?: boolean;
+	userId: User["id"] | null;
+	hasUnreadNote?: boolean;
 };
 
 export type Following = {