diff --git a/packages/fakeyou.com/src/components/common/Card/ImageCard/ImageCard.tsx b/packages/fakeyou.com/src/components/common/Card/ImageCard/ImageCard.tsx index 3e2e43f1ae..d5cd1744c0 100644 --- a/packages/fakeyou.com/src/components/common/Card/ImageCard/ImageCard.tsx +++ b/packages/fakeyou.com/src/components/common/Card/ImageCard/ImageCard.tsx @@ -19,7 +19,7 @@ interface ImageCardProps { source?: string; type: "media" | "weights"; inSelectModal?: boolean; - onResultSelect?: (data:{token: string, title:string}) => void; + onResultSelect?: (data: { token: string; title: string }) => void; } export default function ImageCard({ @@ -34,16 +34,16 @@ export default function ImageCard({ }: ImageCardProps) { const history = useHistory(); // const { setToken, setWeightTitle } = useToken(); - const linkUrl = getCardUrl(data,source,type); + const linkUrl = getCardUrl(data, source, type); const handleSelectModalResultSelect = () => { - console.log("handleSelectModalResultSelect") + console.log("handleSelectModalResultSelect"); if (inSelectModal) { - - onResultSelect && onResultSelect({ - token: data.weight_token, - title: data.title - }); + onResultSelect && + onResultSelect({ + token: data.weight_token, + title: data.title, + }); } }; @@ -111,14 +111,16 @@ export default function ImageCard({

{timeAgo}

- + @@ -169,14 +171,16 @@ export default function ImageCard({

{timeAgo}

- + diff --git a/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx b/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx index 6dc98bba21..4cabfca6e2 100644 --- a/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx +++ b/packages/fakeyou.com/src/components/common/Searcher/Searcher.tsx @@ -1,11 +1,11 @@ import React, { useCallback, useEffect, useRef, useState } from "react"; -import { TempInput as Input } from 'components/common'; +import { TempInput as Input } from "components/common"; // import Input from "../Input"; import { faSearch } from "@fortawesome/pro-solid-svg-icons"; import MasonryGrid from "../MasonryGrid/MasonryGrid"; import "./Searcher.scss"; import { Weight } from "@storyteller/components/src/api/weights/GetWeight"; -import { useLazyLists } from "hooks"; +import { useBookmarks, useLazyLists, useRatings } from "hooks"; import { SearchWeights } from "@storyteller/components/src/api/weights/SearchWeights"; import debounce from "lodash.debounce"; import WeightsCards from "../Card/WeightsCards"; @@ -18,7 +18,7 @@ interface SearcherProps { type?: "page" | "modal"; dataType?: "media" | "weights"; weightType?: string; - onResultSelect?: (data:{token:string, title:string}) => void; + onResultSelect?: (data: { token: string; title: string }) => void; searcherKey: string; } @@ -34,8 +34,8 @@ export default function Searcher({ const [foundWeights, setFoundWeights] = useState([]); const [isSearching, setIsSearching] = useState(false); const [searchCompleted, setSearchCompleted] = useState(0); - // const bookmarks = useBookmarks(); - // const ratings = useRatings(); + const bookmarks = useBookmarks(); + const ratings = useRatings(); const [list, listSet] = useState([]); useEffect(() => { @@ -127,7 +127,6 @@ export default function Searcher({ foundWeights.map((data: any, key: number) => { let props = { data, - showCreator: true, type: "weights", inSelectModal: true, onResultSelect, @@ -185,6 +184,8 @@ export default function Searcher({ {weights.list.map((data: any, key: number) => { let props = { data, + ratings, + bookmarks, showCreator: true, type: "weights", inSelectModal: true, diff --git a/packages/fakeyou.com/src/components/common/SplitPanel/SplitPanel.tsx b/packages/fakeyou.com/src/components/common/SplitPanel/SplitPanel.tsx index aeed7d90e2..2b52a8d237 100644 --- a/packages/fakeyou.com/src/components/common/SplitPanel/SplitPanel.tsx +++ b/packages/fakeyou.com/src/components/common/SplitPanel/SplitPanel.tsx @@ -7,7 +7,7 @@ interface HeaderProps { padding?: boolean; } const Header: React.FC = ({ children, padding }) => { - const headerClassName = `${padding ? "p-3 py-4 p-md-4" : ""}`.trim(); + const headerClassName = `${padding ? "p-3 p-md-4 py-md-3" : ""}`.trim(); return
{children}
; }; @@ -16,7 +16,7 @@ interface BodyProps { padding?: boolean; } const Body: React.FC = ({ children, padding }) => { - const bodyClassName = `${padding ? "p-3 py-4 p-md-4" : ""}`.trim(); + const bodyClassName = `${padding ? "p-3 p-md-4" : ""}`.trim(); return
{children}
; }; @@ -25,7 +25,7 @@ interface FooterProps { padding?: boolean; } const Footer: React.FC = ({ children, padding }) => { - const footerClassName = `${padding ? "p-3 py-4 p-md-4" : ""}`.trim(); + const footerClassName = `${padding ? "p-3 p-md-4" : ""}`.trim(); return
{children}
; }; @@ -74,7 +74,7 @@ const SplitPanel: React.FC & { {body} {dividerFooter &&
} {footer} - { } + {} ); }; diff --git a/packages/fakeyou.com/src/components/layout/PageHeaderWithImage/PageHeaderWithImage.tsx b/packages/fakeyou.com/src/components/layout/PageHeaderWithImage/PageHeaderWithImage.tsx index cc5b1509e2..ed5773a896 100644 --- a/packages/fakeyou.com/src/components/layout/PageHeaderWithImage/PageHeaderWithImage.tsx +++ b/packages/fakeyou.com/src/components/layout/PageHeaderWithImage/PageHeaderWithImage.tsx @@ -9,6 +9,7 @@ interface Props { title: React.ReactNode; subText: React.ReactNode; yOffset?: string; + extension?: React.ReactNode; } function PageHeaderWithImage(props: Props) { @@ -31,6 +32,12 @@ function PageHeaderWithImage(props: Props) {

{props.subText}

+ + {props.extension && ( +
+ {props.extension} +
+ )}
diff --git a/packages/fakeyou.com/src/v2/view/pages/text_to_image/TextToImagePage.tsx b/packages/fakeyou.com/src/v2/view/pages/text_to_image/TextToImagePage.tsx index 9c9e7e5d11..8037a2a9b6 100644 --- a/packages/fakeyou.com/src/v2/view/pages/text_to_image/TextToImagePage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/text_to_image/TextToImagePage.tsx @@ -30,7 +30,7 @@ export default function TextToImagePage({ const hasImageGenJobs = inferenceJobs && inferenceJobs.length > 0; if (!sessionWrapper.canAccessStudio()) { - return + return ; } return ( @@ -40,7 +40,7 @@ export default function TextToImagePage({ titleIcon={faMessageImage} title="Text to Image" subText="Transform your thoughts into art." - yOffset="76%" + yOffset="68%" /> {hasImageGenJobs && ( diff --git a/packages/fakeyou.com/src/v2/view/pages/weight/inference_panels/SdInferencePanel.tsx b/packages/fakeyou.com/src/v2/view/pages/weight/inference_panels/SdInferencePanel.tsx index 3cc222bd12..43a41c3cf1 100644 --- a/packages/fakeyou.com/src/v2/view/pages/weight/inference_panels/SdInferencePanel.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/weight/inference_panels/SdInferencePanel.tsx @@ -5,9 +5,9 @@ import { Input, Label, NumberSlider, - Panel, SegmentButtons, SelectModal, + SplitPanel, TempSelect, TempTextArea, } from "components/common"; @@ -16,6 +16,7 @@ import { faRectangleLandscape, faRectanglePortrait, faSquare, + faUpload, } from "@fortawesome/pro-solid-svg-icons"; import { v4 as uuidv4 } from "uuid"; import { @@ -278,7 +279,7 @@ function SdInferencePanel({ ); } } else if (EnqueueImageGenIsError(response)) { - console.log("error",response); + console.log("error", response); } setIsEnqueuing(false); @@ -293,186 +294,198 @@ function SdInferencePanel({ }; return ( - -

Generate an Image

- -
- {isStandalone && ( - - )} - - - - -
- - - -
-
- -
- - -
-
- - - - - - + +
+

Generate an Image

+
+
+
+
+ +
+ {isStandalone && ( + )} -
-
+ + + +
+
+ +
+ + +
+
+ + + + +
+
{" "}
-
- - + + +
+
+
-
-
- - + + ); }