feat: add semanticId to PostInfo, PostInfoViewModel, and PostInfoResponseDto; update PostPreview link

frontend/.env.example

@@ -0,0 +1 @@
+PUBLIC_API_BASE_URL=http://127.0.0.1:5173/api/

frontend/src/lib/post/adapter/gateway/postApiService.ts

@@ -3,5 +3,5 @@ import type { PostResponseDto } from '$lib/post/adapter/gateway/postResponseDto'
 
 export interface PostApiService {
 	getAllPosts(): Promise<PostInfoResponseDto[]>;
-	getPost(id: number): Promise<PostResponseDto | null>;
+	getPost(id: string): Promise<PostResponseDto | null>;
 }

frontend/src/lib/post/adapter/gateway/postInfoResponseDto.ts

@@ -4,6 +4,7 @@ import z from 'zod';
 
 export const PostInfoResponseSchema = z.object({
 	id: z.int32(),
+	semantic_id: z.string(),
 	title: z.string(),
 	description: z.string(),
 	preview_image_url: z.url(),
@@ -13,6 +14,7 @@ export const PostInfoResponseSchema = z.object({
 
 export class PostInfoResponseDto {
 	readonly id: number;
+	readonly semanticId: string;
 	readonly title: string;
 	readonly description: string;
 	readonly previewImageUrl: URL;
@@ -21,6 +23,7 @@ export class PostInfoResponseDto {
 
 	private constructor(props: {
 		id: number;
+		semanticId: string;
 		title: string;
 		description: string;
 		previewImageUrl: URL;
@@ -28,6 +31,7 @@ export class PostInfoResponseDto {
 		publishedTime: Date | null;
 	}) {
 		this.id = props.id;
+		this.semanticId = props.semanticId;
 		this.title = props.title;
 		this.description = props.description;
 		this.previewImageUrl = props.previewImageUrl;
@@ -45,6 +49,7 @@ export class PostInfoResponseDto {
 
 		return new PostInfoResponseDto({
 			id: parsedJson.id,
+			semanticId: parsedJson.semantic_id,
 			title: parsedJson.title,
 			description: parsedJson.description,
 			previewImageUrl: new URL(parsedJson.preview_image_url),
@@ -56,6 +61,7 @@ export class PostInfoResponseDto {
 	toEntity(): PostInfo {
 		return new PostInfo({
 			id: this.id,
+			semanticId: this.semanticId,
 			title: this.title,
 			description: this.description,
 			previewImageUrl: this.previewImageUrl,

frontend/src/lib/post/adapter/gateway/postRepositoryImpl.ts

@@ -11,7 +11,7 @@ export class PostRepositoryImpl implements PostRepository {
 		return dtos.map((dto) => dto.toEntity());
 	}
 
-	async getPost(id: number): Promise<Post | null> {
+	async getPost(id: string): Promise<Post | null> {
 		const dto = await this.postApiService.getPost(id);
 		return dto?.toEntity() ?? null;
 	}

frontend/src/lib/post/adapter/presenter/postBloc.ts

@@ -32,7 +32,7 @@ export class PostBloc {
 		}
 	}
 
-	private async loadPost(id: number): Promise<PostState> {
+	private async loadPost(id: string): Promise<PostState> {
 		this.state.set({ status: StatusType.Loading, data: get(this.state).data });
 
 		const post = await this.getPostUseCase.execute(id);
@@ -56,7 +56,7 @@ export enum PostEventType {
 	PostLoadedEvent
 }
 
-export interface PostLoadedEvent {
+interface PostLoadedEvent {
 	event: PostEventType.PostLoadedEvent;
-	id: number;
+	id: string;
 }

frontend/src/lib/post/adapter/presenter/postInfoViewModel.ts

@@ -6,6 +6,7 @@ import type { PostInfo } from '$lib/post/domain/entity/postInfo';
 
 export class PostInfoViewModel {
 	readonly id: number;
+	readonly semanticId: string;
 	readonly title: string;
 	readonly description: string;
 	readonly previewImageUrl: URL;
@@ -14,6 +15,7 @@ export class PostInfoViewModel {
 
 	private constructor(props: {
 		id: number;
+		semanticId: string;
 		title: string;
 		description: string;
 		previewImageUrl: URL;
@@ -21,6 +23,7 @@ export class PostInfoViewModel {
 		publishedTime: Date | null;
 	}) {
 		this.id = props.id;
+		this.semanticId = props.semanticId;
 		this.title = props.title;
 		this.description = props.description;
 		this.previewImageUrl = props.previewImageUrl;
@@ -31,6 +34,7 @@ export class PostInfoViewModel {
 	static fromEntity(postInfo: PostInfo): PostInfoViewModel {
 		return new PostInfoViewModel({
 			id: postInfo.id,
+			semanticId: postInfo.semanticId,
 			title: postInfo.title,
 			description: postInfo.description,
 			previewImageUrl: postInfo.previewImageUrl,
@@ -47,6 +51,7 @@ export class PostInfoViewModel {
 
 		return new PostInfoViewModel({
 			id: props.id,
+			semanticId: props.semanticId,
 			title: props.title,
 			description: props.description,
 			previewImageUrl: new URL(props.previewImageUrl),
@@ -66,6 +71,7 @@ export class PostInfoViewModel {
 	dehydrate(): DehydratedPostInfoProps {
 		return {
 			id: this.id,
+			semanticId: this.semanticId,
 			title: this.title,
 			description: this.description,
 			previewImageUrl: this.previewImageUrl.href,
@@ -77,6 +83,7 @@ export class PostInfoViewModel {
 
 export interface DehydratedPostInfoProps {
 	id: number;
+	semanticId: string;
 	title: string;
 	description: string;
 	previewImageUrl: string;

frontend/src/lib/post/application/repository/postRepository.ts

@@ -3,5 +3,5 @@ import type { PostInfo } from '$lib/post/domain/entity/postInfo';
 
 export interface PostRepository {
 	getAllPosts(): Promise<PostInfo[]>;
-	getPost(id: number): Promise<Post | null>;
+	getPost(id: string): Promise<Post | null>;
 }

frontend/src/lib/post/application/useCase/getPostUseCase.ts

@@ -4,7 +4,7 @@ import type { Post } from '$lib/post/domain/entity/post';
 export class GetPostUseCase {
 	constructor(private readonly postRepository: PostRepository) {}
 
-	execute(id: number): Promise<Post | null> {
+	execute(id: string): Promise<Post | null> {
 		return this.postRepository.getPost(id);
 	}
 }

frontend/src/lib/post/domain/entity/postInfo.ts

@@ -2,6 +2,7 @@ import type { Label } from '$lib/post/domain/entity/label';
 
 export class PostInfo {
 	readonly id: number;
+	readonly semanticId: string;
 	readonly title: string;
 	readonly description: string;
 	readonly previewImageUrl: URL;
@@ -10,6 +11,7 @@ export class PostInfo {
 
 	constructor(props: {
 		id: number;
+		semanticId: string;
 		title: string;
 		description: string;
 		previewImageUrl: URL;
@@ -17,6 +19,7 @@ export class PostInfo {
 		publishedTime: Date | null;
 	}) {
 		this.id = props.id;
+		this.semanticId = props.semanticId;
 		this.title = props.title;
 		this.description = props.description;
 		this.previewImageUrl = props.previewImageUrl;

frontend/src/lib/post/framework/api/postApiServiceImpl.ts

@@ -19,7 +19,7 @@ export class PostApiServiceImpl implements PostApiService {
 		return json.map(PostInfoResponseDto.fromJson);
 	}
 
-	async getPost(id: number): Promise<PostResponseDto | null> {
+	async getPost(id: string): Promise<PostResponseDto | null> {
 		const url = new URL(`post/${id}`, Environment.API_BASE_URL);
 
 		const response = await this.fetchFn(url.href);

frontend/src/lib/post/framework/ui/PostContentPage.svelte

@@ -7,7 +7,7 @@
 	import generateTitle from '$lib/common/framework/ui/generateTitle';
 	import StructuredData from '$lib/post/framework/ui/StructuredData.svelte';
 
-	const { id }: { id: number } = $props();
+	const { id }: { id: string } = $props();
 
 	const postBloc = getContext<PostBloc>(PostBloc.name);
 	const state = $derived($postBloc);
@@ -32,7 +32,7 @@
 		{/if}
 	{/if}
 </svelte:head>
-<article class="container prose pb-10 prose-gray">
+<article class="prose prose-gray container pb-10">
 	{#if state.data}
 		<PostContentHeader postInfo={state.data.info} />
 		<div class="max-w-3xl">

frontend/src/lib/post/framework/ui/PostPreview.svelte

@@ -17,7 +17,7 @@
 	}
 </script>
 
-<a class="flex cursor-pointer flex-col gap-y-6" href="/post/{postInfo.id}" title={postInfo.title}>
+<a class="flex cursor-pointer flex-col gap-y-6" href="/post/{postInfo.semanticId}" title={postInfo.title}>
 	<div class="relative aspect-video overflow-hidden rounded-2xl bg-gray-200">
 		<img
 			class="rounded-2xl object-cover transition-opacity duration-300

frontend/src/routes/post/[id]/+page.server.ts

@@ -5,14 +5,9 @@ import type { PageServerLoad } from './$types';
 export const load: PageServerLoad = async ({ locals, params }) => {
 	const { postBloc } = locals;
 
-	const id = parseInt(params.id, 10);
-	if (isNaN(id) || id <= 0) {
-		error(400, { message: 'Invalid post ID' });
-	}
-
 	const state = await postBloc.dispatch({
 		event: PostEventType.PostLoadedEvent,
-		id: id
+		id: params.id
 	});
 	if (!state.data) {
 		error(404, { message: 'Post not found' });

frontend/src/routes/post/[id]/+page.svelte

@@ -9,8 +9,7 @@
 	import PostContentPage from '$lib/post/framework/ui/PostContentPage.svelte';
 
 	const { data, params }: PageProps = $props();
-
-	const id = parseInt(params.id, 10);
+	const { id } = params;
 
 	const initialData = PostViewModel.rehydrate(data.dehydratedData!);