JohnCosta27/Haystack
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

feat: allowing users to delete images from lists

Browse Source
This commit is contained in:
John Costa
2025-08-30 21:38:01 +01:00
parent 94ee8bdb7e
commit 2dd9f33303
7 changed files with 188 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
backend/models/lists.go
View File

@ -195,7 +195,23 @@ func (m ListModel) Save(ctx context.Context, userId uuid.UUID, name string, desc
return listWithItems, err
}
func (m ListModel) SaveInto(ctx context.Context, listId uuid.UUID, imageId uuid.UUID, schemaValues []IDValue) error {
func (m ListModel) SaveInto(ctx context.Context, listID uuid.UUID, imageID uuid.UUID, schemaValues []IDValue) error {
tx, err := m.dbPool.BeginTx(ctx, nil)
if err != nil {
return err
}
var imageList model.ImageLists
stmt := ImageLists.INSERT(ImageLists.ListID, ImageLists.ImageID).
VALUES(listID, imageID).
RETURNING(ImageLists.ID)
err = stmt.QueryContext(ctx, m.dbPool, &imageList)
if err != nil {
tx.Rollback()
return fmt.Errorf("Could not insert new list. %s", err)
}
imageSchemaItems := make([]model.ImageSchemaItems, len(schemaValues))
for i, v := range schemaValues {
@ -205,24 +221,10 @@ func (m ListModel) SaveInto(ctx context.Context, listId uuid.UUID, imageId uuid.
}
imageSchemaItems[i].SchemaItemID = parsedId
imageSchemaItems[i].ImageID = imageId
imageSchemaItems[i].ImageID = imageList.ID
imageSchemaItems[i].Value = &v.Value
}
tx, err := m.dbPool.BeginTx(ctx, nil)
if err != nil {
return err
}
stmt := ImageLists.INSERT(ImageLists.ListID, ImageLists.ImageID).
VALUES(listId, imageId)
_, err = stmt.ExecContext(ctx, tx)
if err != nil {
tx.Rollback()
return fmt.Errorf("Could not insert new list. %s", err)
}
insertSchemaItemsStmt := ImageSchemaItems.
INSERT(ImageSchemaItems.Value, ImageSchemaItems.SchemaItemID, ImageSchemaItems.ImageID).
MODELS(imageSchemaItems)
@ -251,6 +253,18 @@ func (m ListModel) SaveProcessing(ctx context.Context, userID uuid.UUID, title s
// DELETE methods
// ========================================
func (m ListModel) DeleteImage(ctx context.Context, listID uuid.UUID, imageID uuid.UUID) error {
deleteImageListStmt := ImageLists.DELETE().
WHERE(
ImageLists.ListID.EQ(UUID(listID)).
AND(ImageLists.ImageID.EQ(UUID(imageID))),
)
_, err := deleteImageListStmt.ExecContext(ctx, m.dbPool)
return err
}
func (m ListModel) Delete(ctx context.Context, listID uuid.UUID, userID uuid.UUID) error {
// First verify the list belongs to the user
checkOwnershipStmt := Lists.

2
backend/models/user.go
View File

@ -107,7 +107,7 @@ func (m UserModel) ListWithImages(ctx context.Context, userId uuid.UUID) ([]List
INNER_JOIN(Schemas, Schemas.ListID.EQ(Lists.ID)).
INNER_JOIN(SchemaItems, SchemaItems.SchemaID.EQ(Schemas.ID)).
LEFT_JOIN(ImageLists, ImageLists.ListID.EQ(Lists.ID)).
LEFT_JOIN(ImageSchemaItems, ImageSchemaItems.ImageID.EQ(ImageLists.ImageID)),
LEFT_JOIN(ImageSchemaItems, ImageSchemaItems.ImageID.EQ(ImageLists.ID)),
).
WHERE(Lists.UserID.EQ(UUID(userId)))

2
backend/schema.sql
View File

@ -93,7 +93,7 @@ CREATE TABLE haystack.image_schema_items (
value TEXT,
schema_item_id UUID NOT NULL REFERENCES haystack.schema_items (id),
image_id UUID NOT NULL REFERENCES haystack.image (id) ON DELETE CASCADE
image_id UUID NOT NULL REFERENCES haystack.image_lists (id) ON DELETE CASCADE
);
/* -----| Indexes |----- */

48
backend/stacks/handler.go
View File

@ -13,11 +13,15 @@ import (
"github.com/charmbracelet/log"
"github.com/go-chi/chi/v5"
"github.com/google/uuid"
)
type StackHandler struct {
logger *log.Logger
imageModel models.ImageModel
stackModel models.ListModel
limitsManager limits.LimitsManagerMethods
}
@ -94,6 +98,47 @@ func (h *StackHandler) deleteStack(w http.ResponseWriter, r *http.Request) {
w.WriteHeader(http.StatusOK)
}
func (h *StackHandler) deleteImageFromStack(w http.ResponseWriter, r *http.Request) {
ctx := r.Context()
stringImageID := chi.URLParam(r, "imageID")
stringListID := chi.URLParam(r, "listID")
imageID, err := uuid.Parse(stringImageID)
if err != nil {
w.WriteHeader(http.StatusBadRequest)
return
}
listID, err := uuid.Parse(stringListID)
if err != nil {
w.WriteHeader(http.StatusBadRequest)
return
}
// TODO: this should be extracted into a middleware of sorts
userID, err := middleware.GetUserID(ctx, h.logger, w)
if err != nil {
w.WriteHeader(http.StatusUnauthorized)
return
}
isAuthorized := h.imageModel.IsUserAuthorized(ctx, imageID, userID)
if !isAuthorized {
w.WriteHeader(http.StatusUnauthorized)
return
}
err = h.stackModel.DeleteImage(ctx, listID, imageID)
if err != nil {
h.logger.Warn("failed to delete image from list", "error", err)
w.WriteHeader(http.StatusInternalServerError)
return
}
w.WriteHeader(http.StatusOK)
}
type CreateStackBody struct {
Title string `json:"title"`
@ -149,15 +194,18 @@ func (h *StackHandler) CreateRoutes(r chi.Router) {
r.Post("/", middleware.WithLimit(h.logger, h.limitsManager.HasReachedStackLimit, middleware.WithValidatedPost(h.createStack)))
r.Patch("/{listID}", middleware.WithValidatedPost(h.editStack))
r.Delete("/{listID}", h.deleteStack)
r.Delete("/{listID}/{imageID}", h.deleteImageFromStack)
})
}
func CreateStackHandler(db *sql.DB, limitsManager limits.LimitsManagerMethods) StackHandler {
stackModel := models.NewListModel(db)
imageModel := models.NewImageModel(db)
logger := log.New(os.Stdout).WithPrefix("Stacks")
return StackHandler{
logger,
imageModel,
stackModel,
limitsManager,
}

6
frontend/src/contexts/SearchImageContext.tsx
View File

@ -7,7 +7,7 @@ import {
createResource,
useContext,
} from "solid-js";
import { deleteImage, getUserImages, JustTheImageWhatAreTheseNames } from "../network";
import { deleteImage, deleteImageFromStack, getUserImages, JustTheImageWhatAreTheseNames } from "../network";
export type SearchImageStore = {
imagesByDate: Accessor<
@ -24,6 +24,7 @@ export type SearchImageStore = {
onRefetchImages: () => void;
onDeleteImage: (imageID: string) => void;
onDeleteImageFromStack: (stackID: string, imageID: string) => void;
};
const SearchImageContext = createContext<SearchImageStore>();
@ -71,6 +72,9 @@ export const SearchImageContextProvider: Component<ParentProps> = (props) => {
onRefetchImages: refetch,
onDeleteImage: (imageID: string) => {
deleteImage(imageID).then(refetch);
},
onDeleteImageFromStack: (stackID: string, imageID: string) => {
deleteImageFromStack(stackID, imageID).then(refetch);
}
}}
>

43
frontend/src/network/index.ts
View File

@ -6,8 +6,8 @@ import {
literal,
null_,
nullable,
parse,
pipe,
safeParse,
strictObject,
string,
transform,
@ -64,8 +64,14 @@ export const sendImageFile = async (
request.headers.set("Content-Type", "application/oclet-stream");
const res = await fetch(request).then((res) => res.json());
const parsedRes = safeParse(sendImageResponseValidator, res);
return parse(sendImageResponseValidator, res);
if (!parsedRes.success) {
console.log(parsedRes.issues)
throw new Error(JSON.stringify(parsedRes.issues));
}
return parsedRes.output;
};
export const deleteImage = async (
@ -79,6 +85,15 @@ export const deleteImage = async (
await fetch(request);
}
export const deleteImageFromStack = async (listID: string, imageID: string): Promise<void> => {
const request = getBaseAuthorizedRequest({
path: `stacks/${listID}/${imageID}`,
method: "DELETE",
});
await fetch(request);
}
export class ImageLimitReached extends Error {
constructor() {
super();
@ -104,7 +119,13 @@ export const sendImage = async (
const res = await rawRes.json();
return parse(sendImageResponseValidator, res);
const parsedRes = safeParse(sendImageResponseValidator, res);
if (!parsedRes.success) {
console.log(parsedRes.issues)
throw new Error(JSON.stringify(parsedRes.issues));
}
return parsedRes.output;
};
const imageMetaValidator = strictObject({
@ -207,7 +228,13 @@ export const getUserImages = async (): Promise<
console.log("Backend response: ", res);
return parse(imageRequestValidator, res);
const parsedRes = safeParse(imageRequestValidator, res);
if (!parsedRes.success) {
console.log(parsedRes.issues)
throw new Error(JSON.stringify(parsedRes.issues));
}
return parsedRes.output;
};
export const postLogin = async (email: string): Promise<void> => {
@ -237,7 +264,13 @@ export const postCode = async (
const res = await fetch(request).then((res) => res.json());
return parse(codeValidator, res);
const parsedRes = safeParse(codeValidator, res);
if (!parsedRes.success) {
console.log(parsedRes.issues)
throw new Error(JSON.stringify(parsedRes.issues));
}
return parsedRes.output;
};
export class ReachedListLimit extends Error {

62
frontend/src/pages/list/index.tsx
View File

@ -1,12 +1,56 @@
import { useSearchImageContext } from "@contexts/SearchImageContext";
import { useParams } from "@solidjs/router";
import { Component, For, Show } from "solid-js";
import { Component, For, Show, createSignal } from "solid-js";
import { base } from "../../network";
import { Dialog } from "@kobalte/core";
const DeleteButton: Component<{ onDelete: () => void }> = (props) => {
const [isOpen, setIsOpen] = createSignal(false);
return (
<>
<button
aria-label="Delete image from list"
class="text-white bg-red-600 hover:bg-red-700 rounded px-2 py-1 text-sm"
onClick={() => setIsOpen(true)}
>
×
</button>
<Dialog.Root open={isOpen()} onOpenChange={setIsOpen}>
<Dialog.Portal>
<Dialog.Overlay class="fixed inset-0 bg-black bg-opacity-50" />
<div class="fixed inset-0 z-50 flex items-center justify-center p-4">
<Dialog.Content class="bg-white rounded-lg shadow-xl max-w-md w-full p-6">
<Dialog.Title class="text-lg font-bold mb-2">
Confirm Delete
</Dialog.Title>
<Dialog.Description class="mb-4">
Are you sure you want to delete this image from
this list?
</Dialog.Description>
<div class="flex justify-end gap-2">
<Dialog.CloseButton>
<button class="px-4 py-2 bg-gray-300 rounded hover:bg-gray-400">
Cancel
</button>
</Dialog.CloseButton>
<button class="px-4 py-2 bg-red-600 text-white rounded hover:bg-red-700" onClick={props.onDelete}>
Confirm
</button>
</div>
</Dialog.Content>
</div>
</Dialog.Portal>
</Dialog.Root>
</>
);
};
export const List: Component = () => {
const { listId } = useParams();
const { lists } = useSearchImageContext();
const { lists, onDeleteImageFromStack } = useSearchImageContext();
const list = () => lists().find((l) => l.ID === listId);
@ -24,8 +68,7 @@ export const List: Component = () => {
<For each={l().Schema.SchemaItems}>
{(item, index) => (
<th
class={`px-6 py-4 text-left text-sm font-semibold text-neutral-900 min-w-32 ${
index() <
class={`px-6 py-4 text-left text-sm font-semibold text-neutral-900 min-w-32 ${index() <
l().Schema.SchemaItems
.length -
1
@ -43,17 +86,16 @@ export const List: Component = () => {
<For each={l().Images}>
{(image, rowIndex) => (
<tr
class={`hover:bg-neutral-50 transition-colors ${
rowIndex() % 2 === 0
class={`hover:bg-neutral-50 transition-colors ${rowIndex() % 2 === 0
? "bg-white"
: "bg-neutral-25"
}`}
>
<td class="px-6 py-4 border-r border-neutral-200">
<div class="w-32 h-24 overflow-hidden rounded-lg">
<div class="flex items-center gap-2">
<a
href={`/image/${image.ImageID}`}
class="w-full h-full flex justify-center"
class="w-32 h-24 flex justify-center rounded-lg overflow-hidden"
>
<img
class="w-full h-full object-cover rounded-lg"
@ -61,13 +103,13 @@ export const List: Component = () => {
alt="List item"
/>
</a>
<DeleteButton onDelete={() => onDeleteImageFromStack(l().ID, image.ImageID)} />
</div>
</td>
<For each={image.Items}>
{(item, colIndex) => (
<td
class={`px-6 py-4 text-sm text-neutral-700 ${
colIndex() <
class={`px-6 py-4 text-sm text-neutral-700 ${colIndex() <
image.Items.length -
1
? "border-r border-neutral-200"