-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #36 from traP-jp/feat/backend-api-gateway
feat: API呼び出しのラッパーを作成
- Loading branch information
Showing
8 changed files
with
268 additions
and
39 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,8 @@ | ||
| @import './base.css'; | ||
|
|
||
| :root { | ||
| --accent-color: #FF922B; | ||
| --primary-text-color: #1111111; | ||
| --dimmed-text-color: #888888; | ||
| --dimmed-border-color: #DDDDDD; | ||
| --accent-color: #ff922b; | ||
| --primary-text-color: #1111111; | ||
| --dimmed-text-color: #888888; | ||
| --dimmed-border-color: #dddddd; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,203 @@ | ||
| export type HttpMethod = 'GET' | 'POST' | 'PUT' | 'DELETE'; | ||
|
|
||
| export const fetchApi = async ( | ||
| method: HttpMethod, | ||
| path: string, | ||
| option?: { parameters?: Record<string, string | undefined>; body?: Record<string, unknown> }, | ||
| ) => { | ||
| const bodyObj = option?.body && { | ||
| headers: { 'Content-Type': 'application/json' }, | ||
| body: JSON.stringify(option?.body), | ||
| }; | ||
| const parameterStr = option?.parameters | ||
| ? new URLSearchParams(JSON.parse(JSON.stringify(option?.parameters))).toString() | ||
| : ''; | ||
| const res = await fetch(`/api${path}?${parameterStr}`, { | ||
| method, | ||
| ...bodyObj, | ||
| }); | ||
| const data = await res.json(); | ||
| return data; | ||
| }; | ||
|
|
||
| export type Expand<T> = T extends infer O ? { [K in keyof O]: O[K] } : never; | ||
|
|
||
| export type CreatedPost = { | ||
| /** | ||
| * 変換元のメッセージ | ||
| */ | ||
| original_message: string; | ||
| /** | ||
| * 変換後のメッセージ | ||
| */ | ||
| converted_message: string; | ||
| /** | ||
| * UUID | ||
| */ | ||
| id: string; | ||
| /** | ||
| * 投稿時刻 | ||
| */ | ||
| created_at: string; | ||
| /** | ||
| * リプライのとき、親のID。そうでなければ自身のID | ||
| */ | ||
| parent_id: string; | ||
| /** | ||
| * リプライのとき、そのおおもとのID。そうでなければ自身のID | ||
| */ | ||
| root_id: string; | ||
| }; | ||
|
|
||
| export type Post = Omit<CreatedPost, 'parent_id'> & { | ||
| /** | ||
| * 投稿したユーザー名 | ||
| */ | ||
| user_name: string; | ||
| /** | ||
| * リアクションのリスト | ||
| */ | ||
| reactions: Reaction[]; | ||
| /** | ||
| * 自分がリアクションしたリアクションIDのリスト | ||
| */ | ||
| my_reactions: number[]; | ||
| }; | ||
| export type PostWithoutParents = Omit<Post, 'root_id'>; | ||
| export type PostDetail = PostWithoutParents & { | ||
| /** | ||
| * 全ての祖先投稿で、古い順 | ||
| */ | ||
| ancestors: Array<{ | ||
| post: Omit<PostWithoutParents, 'parent_id' | 'root_id'>; | ||
| children_count: number; | ||
| }>; | ||
| /** | ||
| * 1個下の子投稿で、新しい順 | ||
| */ | ||
| children: Array<{ | ||
| post: Omit<PostWithoutParents, 'parent_id' | 'root_id'>; | ||
| children_count: number; | ||
| }>; | ||
| }; | ||
|
|
||
| export type Reaction = { | ||
| /** | ||
| * リアクションID | ||
| */ | ||
| id: number; | ||
| /** | ||
| * カウント | ||
| */ | ||
| count: number; | ||
| }; | ||
| export type ReactionDetail = { | ||
| /** | ||
| * リアクションID | ||
| */ | ||
| id: number; | ||
| /** | ||
| * リアクションしたユーザーのID | ||
| */ | ||
| users: string[]; | ||
| }; | ||
|
|
||
| export type CreatePostBody = { | ||
| /** | ||
| * メッセージ | ||
| */ | ||
| message: string; | ||
| /** | ||
| * リプライのとき、親のID。そうでなければundefined | ||
| */ | ||
| parent_id?: string; | ||
| }; | ||
| export type CreatePostResponse = CreatedPost; | ||
| export const createPost = async (body: CreatePostBody): Promise<CreatePostResponse> => { | ||
| return fetchApi('POST', '/posts', { body }); | ||
| }; | ||
|
|
||
| export type GetPostsParameters = { | ||
| /** | ||
| * 取得件数。デフォルト30 | ||
| */ | ||
| limit?: number; | ||
| /** | ||
| * このIDの投稿より後に投稿されたものを取得する。指定されない場合は、最新のものからlimit件取得する | ||
| */ | ||
| after?: string; | ||
| /** | ||
| * リポストのやつを含むかどうか。デフォルトはfalse | ||
| */ | ||
| repost?: boolean; | ||
| }; | ||
| export type GetPostsResponse = Array< | ||
| Expand< | ||
| Post & { | ||
| /** | ||
| * リポストの場合はリポストしたユーザーの名前 | ||
| */ | ||
| repost_user?: string; | ||
| } | ||
| > | ||
| >; | ||
| export const getPosts = async ({ | ||
| limit, | ||
| after, | ||
| repost, | ||
| }: GetPostsParameters): Promise<CreatePostResponse[]> => { | ||
| return fetchApi('GET', '/posts', { | ||
| parameters: { limit: limit?.toString() ?? '30', after, repost: repost?.toString() ?? 'false' }, | ||
| }); | ||
| }; | ||
|
|
||
| type GetPostResponse = Expand<PostDetail>; | ||
| export const getPost = async (postId: string): Promise<GetPostResponse> => { | ||
| return fetchApi('GET', `/posts/${postId}`); | ||
| }; | ||
|
|
||
| export type PostReactionResponse = Reaction[]; | ||
| export const postReaction = async (postId: string, reactionId: number) => { | ||
| return fetchApi('POST', `/posts/${postId}/reactions/${reactionId}`); | ||
| }; | ||
|
|
||
| export type DeleteReactionResponse = Reaction[]; | ||
| export const deleteReaction = async (postId: string, reactionId: number) => { | ||
| return fetchApi('DELETE', `/posts/${postId}/reactions/${reactionId}`); | ||
| }; | ||
|
|
||
| export type GetReactionsResponse = ReactionDetail[]; | ||
| export const getReactions = async (postId: string) => { | ||
| return fetchApi('GET', `/posts/${postId}/reactions`); | ||
| }; | ||
|
|
||
| export type GetTrendResponse = Array<Post>; | ||
| export const getTrend = async (reactionId: number) => { | ||
| return fetchApi('GET', '/trend', { parameters: { reaction_id: reactionId.toString() } }); | ||
| }; | ||
|
|
||
| export type GetUserResponse = { | ||
| /** | ||
| * ユーザーID | ||
| */ | ||
| user_name: string; | ||
| /** | ||
| * 投稿数 | ||
| */ | ||
| post_count: number; | ||
| /** | ||
| * リアクションした数 | ||
| */ | ||
| reaction_count: number; | ||
| /** | ||
| * リアクションされた数 | ||
| */ | ||
| get_reaction_count: number; | ||
| /** | ||
| * 投稿のリスト | ||
| */ | ||
| posts: Post[]; | ||
| }; | ||
| export const getUser = async (userName: string) => { | ||
| return fetchApi('GET', `/user/${userName}`); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1 +1 @@ | ||
| export const reactionIcons = ['❤️', '🔥', '💧', '😢', '🤔']; | ||
| export const reactionIcons = ['❤️', '🔥', '💧', '😢', '🤔']; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| import { ref, type UnwrapRef } from 'vue'; | ||
|
|
||
| export const useFetcher = <T>(fetcher: () => Promise<UnwrapRef<T>>) => { | ||
| const data = ref<T | undefined>(undefined); | ||
| const loading = ref(true); | ||
| const error = ref<Error | undefined>(undefined); | ||
|
|
||
| fetcher() | ||
| .then((fetchedData) => { | ||
| data.value = fetchedData; | ||
| loading.value = false; | ||
| }) | ||
| .catch((e) => { | ||
| error.value = e; | ||
| loading.value = false; | ||
| }); | ||
|
|
||
| return { data, loading, error }; | ||
| }; |