From 8acb540bb0d5e7cca7aefe954c816281a9b199c7 Mon Sep 17 00:00:00 2001 From: Victor Date: Mon, 12 Feb 2024 21:38:59 -0800 Subject: [PATCH] media browser pages --- packages/components/src/api/weights/Search.ts | 19 ++++++++++++++ .../entities/EntityInput/EntityInput.tsx | 26 ++++++++++++------- .../hooks/useListContent/useListContent.tsx | 18 ++++++++----- .../view/pages/dev_upload/DevMediaInput.tsx | 3 ++- 4 files changed, 48 insertions(+), 18 deletions(-) create mode 100644 packages/components/src/api/weights/Search.ts diff --git a/packages/components/src/api/weights/Search.ts b/packages/components/src/api/weights/Search.ts new file mode 100644 index 0000000000..95303e1836 --- /dev/null +++ b/packages/components/src/api/weights/Search.ts @@ -0,0 +1,19 @@ +import MakeRequest from "../MakeRequest"; +import { Weight } from "./GetWeight"; + +export interface SearchWeightRequest { + search_term: string; + weight_type?: string; + weight_category?: string; + ietf_language_tag?: string; +} + +export interface SearchWeightResponse { + success: boolean; + weights?: Weight[]; +} + +export const SearchWeight = MakeRequest({ + method: "POST", + routingFunction: () => `/v1/weights/search`, +}); diff --git a/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx b/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx index 3224678abb..128d56b352 100644 --- a/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx +++ b/packages/fakeyou.com/src/components/entities/EntityInput/EntityInput.tsx @@ -14,13 +14,20 @@ import { UploadMedia, UploadMediaResponse } from "@storyteller/components/src/ap import { v4 as uuidv4 } from "uuid"; import "./EntityInput.scss"; +// enum EntityInputMode { +// Bookmarks = "bookmarks", +// Media = "media", +// Weights = "weights", +// SearchWeights = "searchWeights", +// } + interface Props { + aspectRatio?: "square" | "landscape" | "portrait", + mediaType?: MediaFilterProp, label?: string, onChange?: any, - owner?: string, - mediaType?: MediaFilterProp, - aspectRatio?: "square" | "landscape" | "portrait", - weightType?: WeightFilterProp, + type: string, + weightType?: WeightFilterProp } interface SlideProps { @@ -31,9 +38,7 @@ interface EmptySlideProps extends SlideProps { entityType: EntityType, filterType: MediaFilterProp | WeightFilterProp, inputProps?: any, - onSelect: any, open: any, - owner: string, user: any }; @@ -66,10 +71,10 @@ const MocapInputFull = ({ media }: SlideProps) => { ; }; -const MediaPickerEmpty = ({ entityType, filterType, media, onSelect, open, owner, inputProps, user }: EmptySlideProps) => { +const MediaPickerEmpty = ({ entityType, filterType, open, inputProps, user, ...rest }: EmptySlideProps) => { const browserClick = () => open({ component: MediaBrowser, - props: { entityType, filterType, onSelect, owner, username: user?.username || "" } + props: { entityType, filterType, username: user?.username || "", ...rest } }); const mediaIcons = () => { @@ -109,7 +114,7 @@ const AniMod = ({ animating, className, isLeaving, render: Render, style, ...res ; -export default function EntityInput({ aspectRatio = "square", label, onChange, owner, mediaType, weightType }: Props) { +export default function EntityInput({ aspectRatio = "square", label, onChange, mediaType, weightType, ...rest }: Props) { const entityType = mediaType ? EntityType.media : weightType ? EntityType.weights : EntityType.unknown; const filterType = mediaType || weightType || "all"; const { search } = useLocation(); @@ -136,6 +141,7 @@ export default function EntityInput({ aspectRatio = "square", label, onChange, o }); const onSelect = (data: MediaFile) => { mediaSet(data) + console.log("🔅",data); onChange({ target: { name: "temp", value: data.token } }); } const busy = false; @@ -164,7 +170,7 @@ export default function EntityInput({ aspectRatio = "square", label, onChange, o return [ , , - + ][i]; }) diff --git a/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx b/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx index 8f4de8cc8a..066fedbd0f 100644 --- a/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx +++ b/packages/fakeyou.com/src/hooks/useListContent/useListContent.tsx @@ -12,7 +12,9 @@ interface Props { onInputChange?: (x?: any) => any; onSuccess?: (x?: any) => any; pagePreset?: number; + request?: any; requestList?: boolean; + resultsKey?: string; urlParam: string; urlUpdate?: boolean; } @@ -29,7 +31,9 @@ export default function useListContent({ onInputChange = n, onSuccess = n, pagePreset = 0, + request, requestList = false, + resultsKey = "results", urlParam = "", urlUpdate = true, }: Props) { @@ -71,7 +75,7 @@ export default function useListContent({ useEffect(() => { const queries = { - page_index: page, + ...page ? { page_index: page } : {}, ...addQueries, // eventually we should provide a way to type this ... or not. It works ...(sort ? { sort_ascending: true } : {}), }; @@ -83,15 +87,13 @@ export default function useListContent({ if (urlUpdate) { history.replace({ pathname, search }); } statusSet(FetchStatus.in_progress); - fetcher(urlParam, {}, queries).then((res: any) => { + fetcher(urlParam, request, queries).then((res: any) => { if (debug) - console.log(`🪲 useListContent success debug at: ${debug}`, res); + console.log(`🪲 useListContent success debug at: ${debug}`, res, resultsKey); statusSet(FetchStatus.success); onSuccess(res); - if (res.results && res.pagination) { - pageCountSet(res.pagination.total_page_count); - listSet(res.results); - } + if (res[resultsKey]) { listSet(res[resultsKey]); } + if (res.pagination) { pageCountSet(res.pagination.total_page_count); } }); } } @@ -105,6 +107,8 @@ export default function useListContent({ pathname, page, sort, + request, + resultsKey, status, urlParam, urlUpdate diff --git a/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx b/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx index e3508e9952..a72c9f85b4 100644 --- a/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/dev_upload/DevMediaInput.tsx @@ -31,13 +31,14 @@ export default function DevMediaInput({ value }: Props) { entityTypeSet(target.value), options, value: entityType }}/> ownerSet(target.value), placeholder: "User" }}/> -