My Decklists

client/src/API/Decklist.elm

@@ -1,4 +1,4 @@
-module API.Decklist exposing (ResultCreate, ResultIndex, ResultRead, ResultUpdate, create, index, read, update)
+module API.Decklist exposing (ResultCreate, ResultIndex, ResultRead, ResultUpdate, create, index, indexForUser, read, update)
 
 import API.Auth exposing (auth)
 import Deck exposing (DeckPostSave)
@@ -64,3 +64,11 @@ index collection msg =
         { url = "/api/v1/decklist"
         , expect = Http.expectJson msg (Decode.list <| Deck.decoder collection)
         }
+
+
+indexForUser : Shared.Collection -> (ResultIndex -> msg) -> String -> Cmd msg
+indexForUser collection msg userId =
+    Http.get
+        { url = "/api/v1/decklist?userId=" ++ userId
+        , expect = Http.expectJson msg (Decode.list <| Deck.decoder collection)
+        }

client/src/Pages/Decks.elm

@@ -1,18 +1,14 @@
 module Pages.Decks exposing (Model, Msg, page)
 
 import API.Decklist
-import Cards
 import Deck exposing (DeckPostSave)
 import Effect exposing (Effect)
 import Gen.Params.Decks exposing (Params)
-import Gen.Route as Route
-import Html exposing (Html, a, div, li, p, span, text, ul)
-import Html.Attributes exposing (class, href)
+import Html exposing (div, text)
 import Page
 import Request
 import Shared
-import UI.Card
-import UI.Icon
+import UI.DecklistsIndex
 import UI.Layout.Template
 import UI.Text
 import View exposing (View)
@@ -40,7 +36,8 @@ type Model
 init : Shared.Model -> ( Model, Effect Msg )
 init shared =
     ( Loading
-    , Effect.fromCmd <| API.Decklist.index shared.collection FetchedDecklists
+    , API.Decklist.index shared.collection FetchedDecklists
+        |> Effect.fromCmd
     )
 
 
@@ -88,50 +85,6 @@ viewDecklists shared model =
         shared
         [ div []
             [ UI.Text.header [ text "Decklists" ]
-            , ul [ class "deckindex" ]
-                (model |> List.map viewDecklistEntry)
+            , UI.DecklistsIndex.view model
             ]
         ]
-
-
-viewDecklistEntry : DeckPostSave -> Html Msg
-viewDecklistEntry deck =
-    li [ class "deckindexitem" ]
-        [ a [ class "deckindexcard", href <| Route.toHref (Route.Deck__View__Id_ { id = deck.meta.id }) ]
-            [ div [ class "deckindexcard__illustration" ] [ illustrationImage deck.decklist ]
-            , div [ class "deckindexcard__illustration-overlay" ] []
-            , div [ class "deckindexcard__content" ]
-                [ p [ class "deckindexcard__name" ] [ text <| Deck.displayName deck.meta.name ]
-                , p [ class "deckindexcard__byline" ] [ text "by: ", text <| Deck.ownerDisplayName deck.meta ]
-                , p [ class "deckindexcard__clans" ]
-                    (Deck.clansInFaction deck.decklist.faction
-                        |> List.map
-                            (\( clan, _ ) ->
-                                span [ class "deckindexcard__clan" ] [ UI.Icon.clan UI.Icon.Negative clan ]
-                            )
-                    )
-                , p [ class "deckindexcard__summary" ]
-                    [ Deck.leader deck.decklist |> Maybe.map (.name >> text) |> Maybe.withDefault (text "Unknown Leader")
-                    , text " • "
-                    , deck.decklist.haven |> Maybe.map (.name >> text) |> Maybe.withDefault (text "Unknown Haven")
-                    , text " • "
-                    , deck.decklist.agenda |> Maybe.map (.name >> text) |> Maybe.withDefault (text "Unknown Agenda")
-                    ]
-                ]
-            ]
-        ]
-
-
-illustrationImage : Deck.Decklist -> Html Msg
-illustrationImage decklist =
-    case Deck.leader decklist of
-        Just leader ->
-            UI.Card.lazy (Cards.FactionCard leader)
-
-        Nothing ->
-            case Deck.fallbackLeader decklist of
-                Just fallbackLeader ->
-                    UI.Card.lazy (Cards.FactionCard fallbackLeader)
-
-                Nothing ->
-                    span [] []

client/src/Pages/MyDecks.elm

@@ -0,0 +1,92 @@
+module Pages.MyDecks exposing (Model, Msg, page)
+
+import API.Decklist
+import Deck exposing (DeckPostSave)
+import Effect exposing (Effect)
+import Gen.Params.MyDecks exposing (Params)
+import Html exposing (div, text)
+import Page
+import Request
+import Shared
+import UI.DecklistsIndex
+import UI.Layout.Template
+import UI.Text
+import View exposing (View)
+
+
+page : Shared.Model -> Request.With Params -> Page.With Model Msg
+page shared _ =
+    Page.protected.advanced
+        (\user ->
+            { init = init shared user.id
+            , update = update
+            , view = view shared
+            , subscriptions = always Sub.none
+            }
+        )
+
+
+
+-- INIT
+
+
+type Model
+    = Loading
+    | Viewing (List DeckPostSave)
+
+
+init : Shared.Model -> String -> ( Model, Effect Msg )
+init shared userId =
+    ( Loading
+    , API.Decklist.indexForUser shared.collection FetchedDecklists userId
+        |> Effect.fromCmd
+    )
+
+
+
+-- UPDATE
+
+
+type Msg
+    = FromShared Shared.Msg
+    | FetchedDecklists API.Decklist.ResultIndex
+
+
+update : Msg -> Model -> ( Model, Effect Msg )
+update msg model =
+    case msg of
+        FromShared subMsg ->
+            ( model, Effect.fromShared subMsg )
+
+        FetchedDecklists (Ok decks) ->
+            ( Viewing decks, Effect.none )
+
+        FetchedDecklists (Err _) ->
+            ( model, Effect.none )
+
+
+
+----------
+-- VIEW
+----------
+
+
+view : Shared.Model -> Model -> View Msg
+view shared model =
+    case model of
+        Loading ->
+            UI.Layout.Template.view FromShared shared [ text "Loading" ]
+
+        Viewing ddd ->
+            viewDecklists shared ddd
+
+
+viewDecklists : Shared.Model -> List DeckPostSave -> View Msg
+viewDecklists shared model =
+    UI.Layout.Template.view FromShared
+        shared
+        [ div []
+            [ UI.Text.header [ text "My Decklists" ]
+            , UI.DecklistsIndex.view model
+            ]
+        ]

client/src/UI/DecklistsIndex.elm

@@ -0,0 +1,58 @@
+module UI.DecklistsIndex exposing (view)
+
+import Cards
+import Deck exposing (DeckPostSave)
+import Gen.Route as Route
+import Html exposing (Html, a, div, li, p, span, text, ul)
+import Html.Attributes exposing (class, href)
+import UI.Card
+import UI.Icon
+
+
+view : List DeckPostSave -> Html unknown
+view model =
+    ul [ class "deckindex" ]
+        (model |> List.map viewDecklistEntry)
+
+
+viewDecklistEntry : DeckPostSave -> Html msg
+viewDecklistEntry deck =
+    li [ class "deckindexitem" ]
+        [ a [ class "deckindexcard", href <| Route.toHref (Route.Deck__View__Id_ { id = deck.meta.id }) ]
+            [ div [ class "deckindexcard__illustration" ] [ illustrationImage deck.decklist ]
+            , div [ class "deckindexcard__illustration-overlay" ] []
+            , div [ class "deckindexcard__content" ]
+                [ p [ class "deckindexcard__name" ] [ text <| Deck.displayName deck.meta.name ]
+                , p [ class "deckindexcard__byline" ] [ text "by: ", text <| Deck.ownerDisplayName deck.meta ]
+                , p [ class "deckindexcard__clans" ]
+                    (Deck.clansInFaction deck.decklist.faction
+                        |> List.map
+                            (\( clan, _ ) ->
+                                span [ class "deckindexcard__clan" ] [ UI.Icon.clan UI.Icon.Negative clan ]
+                            )
+                    )
+                , p [ class "deckindexcard__summary" ]
+                    [ Deck.leader deck.decklist |> Maybe.map (.name >> text) |> Maybe.withDefault (text "Unknown Leader")
+                    , text " • "
+                    , deck.decklist.haven |> Maybe.map (.name >> text) |> Maybe.withDefault (text "Unknown Haven")
+                    , text " • "
+                    , deck.decklist.agenda |> Maybe.map (.name >> text) |> Maybe.withDefault (text "Unknown Agenda")
+                    ]
+                ]
+            ]
+        ]
+
+
+illustrationImage : Deck.Decklist -> Html msg
+illustrationImage decklist =
+    case Deck.leader decklist of
+        Just leader ->
+            UI.Card.lazy (Cards.FactionCard leader)
+
+        Nothing ->
+            case Deck.fallbackLeader decklist of
+                Just fallbackLeader ->
+                    UI.Card.lazy (Cards.FactionCard fallbackLeader)
+
+                Nothing ->
+                    span [] []

client/src/UI/Layout/Header.elm

@@ -16,6 +16,7 @@ view msg user =
             [ ul [] <|
                 htmlList
                     [ ( True, li [] [ a [ href <| Route.toHref Route.Decks ] [ text "Decks" ] ] )
+                    , ( isJust user, li [] [ a [ href <| Route.toHref Route.MyDecks ] [ text "My Decks" ] ] )
                     , ( isJust user, li [] [ a [ href <| Route.toHref Route.Deck__New ] [ text "New Deck" ] ] )
                     , ( True, li [] [ a [ href <| Route.toHref Route.Search ] [ text "Cards" ] ] )
                     , ( isJust user, li [] [ a [ href <| Route.toHref Route.Profile ] [ text "My Profile" ] ] )

client/src/styles.sass

@@ -1,13 +1,13 @@
 @import ./base.sass
 @import ./Pages/About.sass
 @import ./Pages/Build.sass
-@import ./Pages/Decks.sass
 @import ./Pages/Profile.sass
 @import ./Pages/Search.sass
 @import ./UI/Attribute.sass
 @import ./UI/Card.sass
 @import ./UI/CardName.sass
 @import ./UI/Decklist.sass
+@import ./UI/DecklistsIndex.sass
 @import ./UI/FilterSelection.sass
 @import ./UI/Icon.sass
 @import ./UI/Layout/Header.sass

server/src/db/index.ts

@@ -4,6 +4,7 @@ export { DbError } from "./private/_errors.js";
 export {
   createDecklist,
   fetchDecklist,
+  fetchDecklistsForUser,
   updateDecklist,
   fetchDecklists,
 } from "./private/decklist.js";

server/src/db/private/decklist.ts

@@ -92,6 +92,26 @@ export async function fetchDecklists(): Promise<ExtendedDecklist[]> {
       users.display_name
     FROM decklists
     LEFT JOIN users USING (user_id)
+    ORDER BY decklists.updated_at DESC
+  `);
+
+  return rows.map(rowToDecklist);
+}
+
+export async function fetchDecklistsForUser(
+  userId: string
+): Promise<ExtendedDecklist[]> {
+  const rows = await db.query(sql`
+    SELECT
+      decklist_id,
+      name,
+      user_id,
+      content,
+      users.display_name
+    FROM decklists
+    LEFT JOIN users USING (user_id)
+    WHERE user_id = ${userId}
+    ORDER BY decklists.updated_at DESC
   `);
 
   return rows.map(rowToDecklist);

server/src/server/decklists.ts

@@ -5,6 +5,7 @@ import {
   fetchDecklists,
   createUserIfNeeded,
   fetchDecklist,
+  fetchDecklistsForUser,
 } from "../db/index.js";
 import auth from "./auth.js";
 
@@ -153,8 +154,11 @@ const privateRoutes: FastifyPluginAsync = async (fastify, options) => {
 };
 
 const publicRoutes: FastifyPluginAsync = async (fastify, options) => {
-  fastify.get("/decklist", {
+  fastify.get<{ Querystring: { userId: string } }>("/decklist", {
     schema: {
+      querystring: {
+        userId: { type: "string" },
+      },
       response: {
         200: {
           type: "array",
@@ -180,8 +184,10 @@ const publicRoutes: FastifyPluginAsync = async (fastify, options) => {
         },
       },
     },
-    async handler() {
-      const decklists = await fetchDecklists();
+    async handler(req) {
+      const decklists = await (req.query.userId
+        ? fetchDecklistsForUser(req.query.userId)
+        : fetchDecklists());
       return decklists.map((decklist) => ({
         ...decklist,
         creatorDisplayName: decklist.displayName,