diff --git a/src/main/resources/openapi/api.yaml b/src/main/resources/openapi/api.yaml index edd40bd5..6e1c4382 100644 --- a/src/main/resources/openapi/api.yaml +++ b/src/main/resources/openapi/api.yaml @@ -276,6 +276,7 @@ components: - domain - screenName - description + - url - createdAt properties: id: diff --git a/src/main/web/lib/ApiWrapper.ts b/src/main/web/lib/ApiWrapper.ts new file mode 100644 index 00000000..2fbf3266 --- /dev/null +++ b/src/main/web/lib/ApiWrapper.ts @@ -0,0 +1,16 @@ +import {DefaultApiInterface} from "../generated"; + +export class ApiWrapper { + api: DefaultApiInterface; + + constructor(initApi: DefaultApiInterface) { + this.api = initApi; + console.log(this.api); + console.log(this.postsGet()); + } + + postsGet = async () => this.api.postsGet() + + usersUserNameGet = async (userName: string) => this.api.usersUserNameGet(userName); + +} diff --git a/src/main/web/model/PostDetails.ts b/src/main/web/model/PostDetails.ts new file mode 100644 index 00000000..1aa7250c --- /dev/null +++ b/src/main/web/model/PostDetails.ts @@ -0,0 +1,5 @@ +import {PostResponse, UserResponse} from "../generated"; + +export type PostDetails = PostResponse & { + user: UserResponse +} diff --git a/src/main/web/molecules/ShareScopeIndicator.tsx b/src/main/web/molecules/ShareScopeIndicator.tsx new file mode 100644 index 00000000..7d5ccc7c --- /dev/null +++ b/src/main/web/molecules/ShareScopeIndicator.tsx @@ -0,0 +1,29 @@ +import {Component, Match, Switch} from "solid-js"; +import {Home, Lock, Mail, Public} from "@suid/icons-material"; +import {IconButton} from "@suid/material"; +import {Visibility} from "../generated"; + +export const ShareScopeIndicator: Component<{ visibility: Visibility }> = (props) => { + return }> + + + + + + + + + + + + + + + + + + + + + +} diff --git a/src/main/web/organisms/Post.tsx b/src/main/web/organisms/Post.tsx index 2d52add7..9e9253dc 100644 --- a/src/main/web/organisms/Post.tsx +++ b/src/main/web/organisms/Post.tsx @@ -1,10 +1,11 @@ -import {Component, createSignal, Match, Switch} from "solid-js"; -import {PostResponse} from "../generated"; +import {Component, createSignal} from "solid-js"; import {Box, Card, CardActions, CardContent, CardHeader, IconButton, Menu, MenuItem, Typography} from "@suid/material"; import {Avatar} from "../atoms/Avatar"; -import {Favorite, Home, Lock, Mail, MoreVert, Public, Reply, ScreenRotationAlt} from "@suid/icons-material"; +import {Favorite, MoreVert, Reply, ScreenRotationAlt} from "@suid/icons-material"; +import {PostDetails} from "../model/PostDetails"; +import {ShareScopeIndicator} from "../molecules/ShareScopeIndicator"; -export const Post: Component<{ post: PostResponse }> = (props) => { +export const Post: Component<{ post: PostDetails }> = (props) => { const [anchorEl, setAnchorEl] = createSignal(null) const open = () => Boolean(anchorEl()); const handleClose = () => { @@ -13,7 +14,8 @@ export const Post: Component<{ post: PostResponse }> = (props) => { return ( - } title={"test user"} subheader={"test@test"} + } title={props.post.user.screenName} + subheader={`${props.post.user.name}@${props.post.user.domain}`} action={ { setAnchorEl(event.currentTarget) }}> = (props) => { {new Date(props.post.createdAt).toDateString()} - }> - - - - - - - - - - - - - - - - - - - - - + ) -} \ No newline at end of file +} diff --git a/src/main/web/organisms/PostForm.tsx b/src/main/web/organisms/PostForm.tsx index 47f99603..4a89fa80 100644 --- a/src/main/web/organisms/PostForm.tsx +++ b/src/main/web/organisms/PostForm.tsx @@ -5,7 +5,7 @@ import {AddPhotoAlternate, Poll, Public} from "@suid/icons-material"; export const PostForm: Component<{ label: string }> = (props) => { return ( - + @@ -35,4 +35,4 @@ export const PostForm: Component<{ label: string }> = (props) => { ) -} \ No newline at end of file +} diff --git a/src/main/web/pages/TopPage.tsx b/src/main/web/pages/TopPage.tsx index 948a0e36..451000cd 100644 --- a/src/main/web/pages/TopPage.tsx +++ b/src/main/web/pages/TopPage.tsx @@ -1,56 +1,36 @@ -import {Component} from "solid-js"; +import {Component, createResource} from "solid-js"; import {MainPage} from "../templates/MainPage"; import {PostForm} from "../organisms/PostForm"; import {Stack} from "@suid/material"; -import {Post} from "../organisms/Post"; -import {PostResponse} from "../generated"; +import {DefaultApi} from "../generated"; +import {PostDetails} from "../model/PostDetails"; +import {PostList} from "../templates/PostList"; +import {ApiWrapper} from "../lib/ApiWrapper"; + export const TopPage: Component = () => { + const api = new ApiWrapper(new DefaultApi()) + const [posts] = createResource(api.postsGet); + return ( - + - - - - + { + return { + ...value, + user: { + id: 1234, + createdAt: Date.now(), + domain: "test-hideout.usbharu.dev", + name: "test", + url: "https://test-hideout.usbharu.dev", + screenName: "test", + description: "" + } + } as PostDetails + }) ?? []}/> ) -} \ No newline at end of file +} diff --git a/src/main/web/templates/PostList.tsx b/src/main/web/templates/PostList.tsx new file mode 100644 index 00000000..2b9d0dad --- /dev/null +++ b/src/main/web/templates/PostList.tsx @@ -0,0 +1,14 @@ +import {Component, For} from "solid-js"; +import {CircularProgress} from "@suid/material"; +import {Post} from "../organisms/Post"; +import {PostDetails} from "../model/PostDetails"; + +export const PostList: Component<{ posts: PostDetails[] }> = (props) => { + return ( + }> + { + (item, index) => + } + + ) +}