diff --git a/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/SelectModalWeightsTabs.tsx b/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/SelectModalWeightsTabs.tsx index bff9ed180c..03b8204440 100644 --- a/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/SelectModalWeightsTabs.tsx +++ b/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/SelectModalWeightsTabs.tsx @@ -1,59 +1,41 @@ -import React, { memo, useRef, useState } from "react"; - -import { - useBookmarks, - useListContent, - useRatings, - useSession -} from "hooks"; - -import { - Weight as WeightType, - ListWeights, - GetBookmarksByUser -} from "@storyteller/components/src/api"; - -import { - MasonryGrid, - WeightsCards, - Pagination, - SkeletonCard, - NonRouteTabs -} from "components/common"; +import React, { memo } from "react"; +import { NonRouteTabs } from "components/common"; import { SelectModalData, SelectModalV2} from "../SelectModal"; - -import prepFilter from "resources/prepFilter"; +import TabAllWeights from "./tabAllWeights"; +import TabBookmarkedWeights from "./tabBookmarkedWeights" export default memo(function SelectModalWrapper({ debug = false, value = {title:"",token:""}, modalTitle, inputLabel, + weightType, onSelect }: { debug?: boolean; value?: SelectModalData; modalTitle: string; inputLabel: string; + weightType: "sd_1.5" | "loRA"; onSelect: (data:SelectModalData) => void; }) { const tabs = [{ label: "All Weights", content: ( -
- +
+
) }, - // { - // label: "Bookmarked", - // content: ( - //
- // - //
- // ) - // } + { + label: "Bookmarked Weights", + content: ( +
+ +
+ ) + } ] return ( void; -}){ - const gridContainerRef = useRef(null); - const bookmarks = useBookmarks(); - const ratings = useRatings(); - const [list, listSet] = useState([]); - const { user } = useSession(); - const weights = useListContent({ - addQueries: { - page_size: 9, - ...prepFilter("sd_1.5", "weight_type"), - }, - urlUpdate: false, - debug: debug ? "Weight List" : undefined, - fetcher: ListWeights, - list, - listSet, - requestList: true, - urlParam: user?.username || "" - }); - const handlePageClick = (selectedItem: { selected: number }) => { - weights.pageChange(selectedItem.selected); - }; - - // const { isLoading, page, pageChange, pageCount, status } = useListContent({ - // addQueries: { - // page_size: 9, - // ...prepFilter("sd_1.5", "maybe_scoped_weight_type"), - // }, - // fetcher: GetBookmarksByUser, - // // onSuccess: res => { - // // setShowBookmarksMasonryGrid(true); - // // }, - // list: list, - // debug: "", - // listSet: listSet, - // requestList: true, - // urlParam: user.username, - // urlUpdate: false, - // }); - - const paginationProps = { - onPageChange: handlePageClick, - pageCount: weights.pageCount, - currentPage: weights.page, - }; - if (weights.isLoading){ - return ( -
- {Array.from({ length: 12 }).map((_, index) => ( - - ))} -
- ); - }else if (weights.list.length === 0 && weights.status === 3){ - return( -
- No weights created yet. -
- ); - }else { - return( - <> - - console.log("Layout complete!")} - > - {weights.list.map((data: WeightType, key: number) => { - let props = { - data, - ratings, - bookmarks, - showCreator: true, - type: "weights", - inSelectModal: true, - onResultSelect: onSelect, - }; - return ( -
- -
- ); - })} -
-
- -
- - ); - } -} \ No newline at end of file diff --git a/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/tabAllWeights.tsx b/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/tabAllWeights.tsx new file mode 100644 index 0000000000..b7a79d7bb5 --- /dev/null +++ b/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/tabAllWeights.tsx @@ -0,0 +1,107 @@ +import React, {useRef, useState} from 'react'; +import { + useBookmarks, + useListContent, + useRatings, + useSession +} from "hooks"; +import { + Weight as WeightI, + ListWeights +} from "@storyteller/components/src/api"; +import { SelectModalData } from "../SelectModal"; +import prepFilter from "resources/prepFilter"; +import { + MasonryGrid, + WeightsCards, + Pagination, + SkeletonCard, +} from "components/common"; + +export default function WeightsTabsContent({ + debug=false, + weightType, + onSelect +}:{ + debug?: boolean + weightType: "sd_1.5" | "loRA"; + onSelect: (data:SelectModalData) => void; +}){ + const gridContainerRef = useRef(null); + const bookmarks = useBookmarks(); + const ratings = useRatings(); + const [list, listSet] = useState([]); + const { user } = useSession(); + const weights = useListContent({ + addQueries: { + page_size: 9, + ...prepFilter("sd_1.5", "weight_type"), + }, + urlUpdate: false, + debug: debug ? "All Weights" : undefined, + fetcher: ListWeights, + list, + listSet, + requestList: true, + urlParam: user?.username || "" + }); + const handlePageClick = (selectedItem: { selected: number }) => { + weights.pageChange(selectedItem.selected); + }; + + const paginationProps = { + onPageChange: handlePageClick, + pageCount: weights.pageCount, + currentPage: weights.page, + }; + if (weights.isLoading){ + return ( +
+ {Array.from({ length: 12 }).map((_, index) => ( + + ))} +
+ ); + }else if (weights.list.length === 0 && weights.status === 3){ + return( +
+ No weights created yet. +
+ ); + }else { + return( + <> + + console.log("Layout complete!")} + > + {weights.list.map((data: WeightI, key: number) => { + let props = { + data, + ratings, + bookmarks, + showCreator: true, + type: "weights", + inSelectModal: true, + onResultSelect: onSelect, + }; + return ( +
+ +
+ ); + })} +
+
+ +
+ + ); + } +} \ No newline at end of file diff --git a/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/tabBookmarkedWeights.tsx b/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/tabBookmarkedWeights.tsx new file mode 100644 index 0000000000..2033cbde9d --- /dev/null +++ b/packages/fakeyou.com/src/components/common/SelectModalWeightsTabs/tabBookmarkedWeights.tsx @@ -0,0 +1,109 @@ +import React, {useRef, useState} from 'react'; +import { + useBookmarks, + useListContent, + useRatings, + useSession +} from "hooks"; +import { + Weight as WeightI, + GetBookmarksByUser +} from "@storyteller/components/src/api"; +import { SelectModalData } from "../SelectModal"; +import prepFilter from "resources/prepFilter"; +import { + MasonryGrid, + WeightsCards, + Pagination, + SkeletonCard, +} from "components/common"; + +export default function WeightsTabsContent({ + debug=false, + weightType, + onSelect +}:{ + debug?: boolean; + weightType: "sd_1.5" | "loRA"; + onSelect: (data:SelectModalData) => void; +}){ + const gridContainerRef = useRef(null); + const bookmarks = useBookmarks(); + const ratings = useRatings(); + const [list, listSet] = useState([]); + const { user } = useSession(); + const weights = useListContent({ + addQueries: { + page_size: 9, + ...prepFilter(weightType, "weight_type"), + }, + urlUpdate: false, + debug: debug ? "Bookmarked Weights" : undefined, + fetcher: GetBookmarksByUser, + list, + listSet, + requestList: true, + urlParam: user?.username || "" + }); + const handlePageClick = (selectedItem: { selected: number }) => { + weights.pageChange(selectedItem.selected); + }; + + const paginationProps = { + onPageChange: handlePageClick, + pageCount: weights.pageCount, + currentPage: weights.page, + }; + if (weights.isLoading){ + return ( +
+ {Array.from({ length: 12 }).map((_, index) => ( + + ))} +
+ ); + }else if (weights.list.length === 0 && weights.status === 3){ + return( +
+ No weights created yet. +
+ ); + }else { + return( + <> + + console.log("Layout complete!")} + > + {weights.list.map((data: any, key: number) => { + //TODO: data should be TYPED + let props = { + data, + ratings, + bookmarks, + showCreator: true, + type: "weights", + inSelectModal: true, + onResultSelect: onSelect, + }; + return ( +
+ +
+ ); + })} +
+
+ +
+ + ); + } +} \ No newline at end of file diff --git a/packages/fakeyou.com/src/v2/view/pages/video_workflow/components/pageWorkflowControls/pageWorkflowControls.tsx b/packages/fakeyou.com/src/v2/view/pages/video_workflow/components/pageWorkflowControls/pageWorkflowControls.tsx index c4e72cb366..5ccec551bd 100644 --- a/packages/fakeyou.com/src/v2/view/pages/video_workflow/components/pageWorkflowControls/pageWorkflowControls.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/video_workflow/components/pageWorkflowControls/pageWorkflowControls.tsx @@ -166,32 +166,10 @@ export default function PageFilterControls({
- {/* { - handleOnChange("sdModelToken", token); - }} - tabs={[ - { - label: "All Weights", - tabKey: "allWeights", - typeFilter: "sd_1.5", - searcher: true, - type: "weights", - }, - { - label: "Bookmarked", - tabKey: "bookmarkedWeights", - typeFilter: "sd_1.5", - searcher: false, - type: "weights", - }, - ]} - /> */} { handleOnChange({ "sdModelTitle": title,