[add] document search

api/app-routes.go

@@ -26,6 +26,7 @@ import (
 type queryParams struct {
 	Page     *int64  `form:"page"`
 	Limit    *int64  `form:"limit"`
+	Search   *string `form:"search"`
 	Document *string `form:"document"`
 }
 
@@ -111,8 +112,15 @@ func (api *API) createAppResourcesRoute(routeName string, args ...map[string]any
 		qParams := bindQueryParams(c)
 
 		if routeName == "documents" {
+			var query *string
+			if qParams.Search != nil && *qParams.Search != "" {
+				search := "%" + *qParams.Search + "%"
+				query = &search
+			}
+
 			documents, err := api.DB.Queries.GetDocumentsWithStats(api.DB.Ctx, database.GetDocumentsWithStatsParams{
 				UserID: userID,
+				Query:  query,
 				Offset: (*qParams.Page - 1) * *qParams.Limit,
 				Limit:  *qParams.Limit,
 			})

database/query.sql

@@ -217,7 +217,13 @@ LEFT JOIN users ON users.id = $user_id
 LEFT JOIN
     document_user_statistics AS dus
     ON dus.document_id = docs.id AND dus.user_id = $user_id
-WHERE docs.deleted = false
+WHERE
+    docs.deleted = false AND (
+        $query IS NULL OR (
+            docs.title LIKE $query OR
+            docs.author LIKE $query
+        )
+    )
 ORDER BY dus.last_read DESC, docs.created_at DESC
 LIMIT $limit
 OFFSET $offset;

database/query.sql.go

@@ -631,14 +631,21 @@ LEFT JOIN users ON users.id = ?1
 LEFT JOIN
     document_user_statistics AS dus
     ON dus.document_id = docs.id AND dus.user_id = ?1
-WHERE docs.deleted = false
+WHERE
+    docs.deleted = false AND (
+        ?2 IS NULL OR (
+            docs.title LIKE ?2 OR
+            docs.author LIKE ?2
+        )
+    )
 ORDER BY dus.last_read DESC, docs.created_at DESC
-LIMIT ?3
+LIMIT ?4
-OFFSET ?2
+OFFSET ?3
 `
 
 type GetDocumentsWithStatsParams struct {
 	UserID string      `json:"user_id"`
+	Query  interface{} `json:"query"`
 	Offset int64       `json:"offset"`
 	Limit  int64       `json:"limit"`
 }
@@ -661,7 +668,12 @@ type GetDocumentsWithStatsRow struct {
 }
 
 func (q *Queries) GetDocumentsWithStats(ctx context.Context, arg GetDocumentsWithStatsParams) ([]GetDocumentsWithStatsRow, error) {
-	rows, err := q.db.QueryContext(ctx, getDocumentsWithStats, arg.UserID, arg.Offset, arg.Limit)
+	rows, err := q.db.QueryContext(ctx, getDocumentsWithStats,
+		arg.UserID,
+		arg.Query,
+		arg.Offset,
+		arg.Limit,
+	)
 	if err != nil {
 		return nil, err
 	}

templates/documents.html

@@ -7,6 +7,49 @@
 {{end}}
 
 {{define "content"}}
+<div
+  class="flex flex-col gap-2 grow p-4 mb-4 rounded shadow-lg bg-white dark:bg-gray-700 text-gray-500 dark:text-white"
+>
+  <form class="flex gap-4 flex-col lg:flex-row" action="./documents" method="GET">
+    <div class="flex flex-col w-full grow">
+      <div class="flex relative">
+	<span
+	  class="inline-flex items-center px-3 border-t bg-white border-l border-b border-gray-300 text-gray-500 shadow-sm text-sm"
+	>
+	  <svg
+	    width="15"
+	    height="15"
+	    viewBox="0 0 24 24"
+	    fill="currentColor"
+	    xmlns="http://www.w3.org/2000/svg"
+	  >
+	    <rect width="24" height="24" fill="none" />
+	    <path
+	      fill-rule="evenodd"
+	      clip-rule="evenodd"
+	      d="M10 2C5.58172 2 2 5.58172 2 10C2 14.4183 5.58172 18 10 18C11.8487 18 13.551 17.3729 14.9056 16.3199L20.2929 21.7071C20.6834 22.0976 21.3166 22.0976 21.7071 21.7071C22.0976 21.3166 22.0976 20.6834 21.7071 20.2929L16.3199 14.9056C17.3729 13.551 18 11.8487 18 10C18 5.58172 14.4183 2 10 2Z"
+	    />
+	  </svg>
+	</span>
+	<input
+	  type="text"
+	  id="search"
+	  name="search"
+	  class="flex-1 appearance-none rounded-none border border-gray-300 w-full py-2 px-4 bg-white text-gray-700 placeholder-gray-400 shadow-sm text-base focus:outline-none focus:ring-2 focus:ring-purple-600 focus:border-transparent"
+	  placeholder="Search Author / Title"
+	/>
+      </div>
+    </div>
+
+    <button
+      type="submit"
+      class="px-10 py-2 text-base font-semibold text-center text-white transition duration-200 ease-in bg-black shadow-md hover:text-black hover:bg-white focus:outline-none focus:ring-2"
+    >
+      <span class="w-full">Search</span>
+    </button>
+  </form>
+</div>
+
 <div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
   {{range $doc := .Data }}
   <div class="w-full relative">