Signed-off-by: brookjeynes me@brookjeynes.dev
+8
internal/components/book/book.go
+8
internal/components/book/book.go
+34
internal/components/book/book.templ
+34
internal/components/book/book.templ
···
1
+
package book
2
+
3
+
import "fmt"
4
+
5
+
templ Book(params BookParams) {
6
+
<style>
7
+
.hide {
8
+
display: none;
9
+
}
10
+
.book:hover + .hide {
11
+
display: block;
12
+
}
13
+
</style>
14
+
<div class="relative inline-block">
15
+
<img
16
+
alt={ fmt.Sprintf("%s's spine", params.Title) }
17
+
src={ templ.SafeURL(fmt.Sprintf("https://image.yes24.com/goods/%s/SIDE/XL", params.Yes24Id)) }
18
+
class="book w-6"
19
+
/>
20
+
<div class="hide absolute top-10 left-5 border bg-white z-10">
21
+
<div class="flex gap-2 w-96">
22
+
<div class="w-3/4">
23
+
<h2>{ params.Title }</h2>
24
+
<h4>By { params.Author }</h4>
25
+
<p>{ params.Description }</p>
26
+
</div>
27
+
<img
28
+
class="w-1/4 h-fit"
29
+
src={ templ.SafeURL(fmt.Sprintf("https://image.yes24.com/goods/%s/XL", params.Yes24Id)) }
30
+
/>
31
+
</div>
32
+
</div>
33
+
</div>
34
+
}
+1
-1
internal/components/header/header.go
+1
-1
internal/components/header/header.go
+2
-2
internal/components/header/header.templ
+2
-2
internal/components/header/header.templ
···
1
-
package components
1
+
package header
2
2
3
3
import "fmt"
4
4
···
36
36
<div class="absolute flex flex-col right-0 mt-2 p-1 gap-1 w-48 bg-white drop-shadow-sm">
37
37
<button
38
38
type="button"
39
-
onclick="localStorage.setItem('shlf-language', 'ko');"
39
+
@click="localStorage.setItem('shlf-language', 'ko');"
40
40
hx-swap="none"
41
41
class="button border-none text-sm w-full"
42
42
>
+15
internal/server/my-books.go
+15
internal/server/my-books.go
···
1
+
package server
2
+
3
+
import (
4
+
"net/http"
5
+
6
+
mybooks "shlf.space/internal/views/my-books"
7
+
)
8
+
9
+
func (s *Server) MyBooks(w http.ResponseWriter, r *http.Request) {
10
+
user := s.oauth.GetAccountUser(r)
11
+
12
+
mybooks.MyBooksPage(mybooks.MyBooksParams{
13
+
User: user,
14
+
}).Render(r.Context(), w)
15
+
}
+1
internal/server/router.go
+1
internal/server/router.go
+1
-1
internal/views/index/index.templ
+1
-1
internal/views/index/index.templ
+7
internal/views/my-books/my-books.go
+7
internal/views/my-books/my-books.go
+43
internal/views/my-books/my-books.templ
+43
internal/views/my-books/my-books.templ
···
1
+
package mybooks
2
+
3
+
import (
4
+
"fmt"
5
+
"shlf.space/internal/components/book"
6
+
"shlf.space/internal/components/header"
7
+
"shlf.space/internal/layouts/base"
8
+
)
9
+
10
+
templ MyBooksPage(params MyBooksParams) {
11
+
<style>
12
+
.add-book {
13
+
writing-mode: vertical-rl;
14
+
text-orientation: upright;
15
+
}
16
+
</style>
17
+
@layouts.Base(layouts.BaseParams{Title: fmt.Sprintf("%s's books", params.User.Account.Handle)}) {
18
+
@header.Header(header.HeaderParams{User: params.User})
19
+
<div class="container">
20
+
<div id="book-row-1" class="flex items-end">
21
+
@book.Book(book.BookParams{
22
+
Yes24Id: "124807552",
23
+
Title: "λ©λ©κ³Ό λͺ¨λ¦¬",
24
+
Author: "μμνμΌ μ μ€μΌ",
25
+
Description: "βμ¬λμ 무μμ μν΄ μ΄μκ°λκ°?β, βμ΄μκ°λ μλ―Έμ λͺ©μ μ΄ νμνκ°?βμ λν μ λ΅ μλ κ³ λ―ΌμΌλ‘ κ΄΄λ‘μ΄ λΉμ μκ² μμνμΌ μ μ€μΌκ° μ νλ μΈ κ°μ§ μ΄μΌκΈ°. ",
26
+
})
27
+
@book.Book(book.BookParams{
28
+
Yes24Id: "58552371",
29
+
Title: "μΈκ³λ₯Ό 건λ λμκ² κ°κ²",
30
+
Author: "μ΄κ½λ",
31
+
Description: "βλμκ². μλΉ κ° μ°λΌκ³ ν΄μ μ°λ κ±°μΌ.β 첫 λ¬Έμ₯μΌλ‘ μμν νΈμ§κ° βμΈκ³λ₯Ό 건λ λμκ² κ°κ².βλΌλ λ§μ§λ§ λ¬Έμ₯μ λΏκΈ°κΉμ§, λ μ¬λμ μ§μ¬μ΄ νλμ μ§μ€μ ν₯ν΄ κ°λ λμ μμμ¬λ¦° κ°λμ λ§μ λ
μλ€μκ² μΈμμ μΈκ² λ§λ€μλ€.",
32
+
})
33
+
<a
34
+
href="/browse"
35
+
class="flex flex-col items-center justify-between gap-10 py-2 border border-dashed"
36
+
>
37
+
<i class="w-4 h-4" data-lucide="plus"></i>
38
+
<span class="uppercase text-sm add-book">add book</span>
39
+
</a>
40
+
</div>
41
+
</div>
42
+
}
43
+
}
History
1 round
1 comment
brookjeynes.dev
submitted
#0
1 commit
expand
collapse
feat(views): add 'my books' page
Signed-off-by: brookjeynes <me@brookjeynes.dev>
expand 1 comment
pull request successfully merged
Looks great and I have also tested it and it works!