From 61dee159fb0cd8442f1e67bb0b43a583b68d6190 Mon Sep 17 00:00:00 2001 From: Mercier Mateo Date: Wed, 27 Nov 2024 00:02:06 +0100 Subject: [PATCH 1/4] WIP: Add tag selection on post creation --- public/pages/Home/Home.page.tsx | 2 +- public/pages/Home/components/PostInput.tsx | 23 +++++++++++++++++++--- public/services/actions/post.ts | 4 ++-- 3 files changed, 23 insertions(+), 6 deletions(-) diff --git a/public/pages/Home/Home.page.tsx b/public/pages/Home/Home.page.tsx index a0b1c4f7c..077139cbc 100644 --- a/public/pages/Home/Home.page.tsx +++ b/public/pages/Home/Home.page.tsx @@ -79,7 +79,7 @@ What can we do better? This is the place for you to vote, discuss and share idea
- +
diff --git a/public/pages/Home/components/PostInput.tsx b/public/pages/Home/components/PostInput.tsx index 894c78783..4ee148e2b 100644 --- a/public/pages/Home/components/PostInput.tsx +++ b/public/pages/Home/components/PostInput.tsx @@ -1,14 +1,16 @@ import React, { useState, useEffect, useRef } from "react" import { Button, ButtonClickEvent, Input, Form, TextArea, MultiImageUploader } from "@fider/components" import { SignInModal } from "@fider/components" -import { cache, actions, Failure } from "@fider/services" -import { ImageUpload } from "@fider/models" +import { cache, actions, Failure, navigator, querystring } from "@fider/services" +import { ImageUpload, Tag } from "@fider/models" import { useFider } from "@fider/hooks" import { t, Trans } from "@lingui/macro" +import { TagsFilter } from "./TagsFilter" interface PostInputProps { placeholder: string onTitleChanged: (title: string) => void + tags: Tag[] } const CACHE_TITLE_KEY = "PostInput-Title" @@ -26,6 +28,7 @@ export const PostInput = (props: PostInputProps) => { const titleRef = useRef() const [title, setTitle] = useState(getCachedValue(CACHE_TITLE_KEY)) const [description, setDescription] = useState(getCachedValue(CACHE_DESCRIPTION_KEY)) + const [tags, setTags] = useState(querystring.getArray("tags")) const [isSignInModalOpen, setIsSignInModalOpen] = useState(false) const [attachments, setAttachments] = useState([]) const [error, setError] = useState(undefined) @@ -57,7 +60,7 @@ export const PostInput = (props: PostInputProps) => { const submit = async (event: ButtonClickEvent) => { if (title) { - const result = await actions.createPost(title, description, attachments) + const result = await actions.createPost(title, description, attachments, tags) if (result.ok) { clearError() cache.session.remove(CACHE_TITLE_KEY, CACHE_DESCRIPTION_KEY) @@ -68,6 +71,19 @@ export const PostInput = (props: PostInputProps) => { } } } + + const handleTagsChanged = (newTags: string[]) => { + setTags(newTags) + + navigator.replaceState( + querystring.stringify({ + view: querystring.get("view"), + query: querystring.get("query"), + tags: newTags, + limit: querystring.getNumber("limit") + }) + ) + } const details = () => ( <> @@ -78,6 +94,7 @@ export const PostInput = (props: PostInputProps) => { minRows={5} placeholder={t({ id: "home.postinput.description.placeholder", message: "Describe your suggestion (optional)" })} /> +