diff --git a/packages/components/src/api/BucketConfig.ts b/packages/components/src/api/BucketConfig.ts index 89fef8e0c9..42e739773a 100644 --- a/packages/components/src/api/BucketConfig.ts +++ b/packages/components/src/api/BucketConfig.ts @@ -30,7 +30,7 @@ class BucketConfig { const basePath = this.isLocalDev ? "https://dev-cdn.fakeyou.com" : "https://cdn.fakeyou.com"; - let path = bucketRelativePath.startsWith("/") + let path = bucketRelativePath?.startsWith("/") ? bucketRelativePath : "/" + bucketRelativePath; let resizeParams = ""; diff --git a/packages/components/src/api/_common/enums/MediaFileType.ts b/packages/components/src/api/_common/enums/MediaFileType.ts index b104aeaa7b..6f1ff419ed 100644 --- a/packages/components/src/api/_common/enums/MediaFileType.ts +++ b/packages/components/src/api/_common/enums/MediaFileType.ts @@ -1,6 +1,6 @@ - export enum MediaFileType { Audio = "audio", Video = "video", Image = "image", + None = "none", } diff --git a/packages/components/src/api/bookmarks/GetBookmarksByUser.ts b/packages/components/src/api/bookmarks/GetBookmarksByUser.ts index 21bce70f12..671e07d7a7 100644 --- a/packages/components/src/api/bookmarks/GetBookmarksByUser.ts +++ b/packages/components/src/api/bookmarks/GetBookmarksByUser.ts @@ -1,19 +1,25 @@ import MakeRequest from "../MakeRequest"; -import { Pagination } from "../_common/SharedFetchTypes"; +import { Weight } from "../weights/GetWeight"; export interface UserBookmarksListRequest {} export interface UserBookmarksListResponse { // pagination: Pagination, - success: boolean, - // weights: any + success: boolean; + results: Weight[]; } export interface UserBookmarksListQueries { - page_index: number, + page_index: number; } -export const GetBookmarksByUser = MakeRequest({ +export const GetBookmarksByUser = MakeRequest< + string, + UserBookmarksListRequest, + UserBookmarksListResponse, + UserBookmarksListQueries +>({ method: "GET", - routingFunction: (userToken: string) => `/v1/user_bookmarks/list/user/${userToken}`, -}); \ No newline at end of file + routingFunction: (userToken: string) => + `/v1/user_bookmarks/list/user/${userToken}`, +}); diff --git a/packages/components/src/api/media_files/GetMediaFile.ts b/packages/components/src/api/media_files/GetMediaFile.ts index 29bdc1a7fc..39f42bc1c7 100644 --- a/packages/components/src/api/media_files/GetMediaFile.ts +++ b/packages/components/src/api/media_files/GetMediaFile.ts @@ -1,15 +1,26 @@ import { ApiConfig } from "../ApiConfig"; import { UserDetailsLight } from "../_common/UserDetailsLight"; import { MediaFileType } from "../_common/enums/MediaFileType"; +import { WeightCategory } from "../_common/enums/WeightCategory"; +import { WeightType } from "../_common/enums/WeightType"; +// import { Weight } from "../weights/GetWeight"; export interface MediaFile { - token: string, - media_type: MediaFileType, - public_bucket_path: string, - maybe_creator_user: UserDetailsLight | null, - creator_set_visibility: string, - created_at: Date, - updated_at: Date, + token: string; + media_type: MediaFileType; + public_bucket_path: string; + maybe_creator_user: UserDetailsLight | null; + creator_set_visibility: string; + created_at: Date; + updated_at: Date; + maybe_model_weight_info: { + title: string; + weight_token: string; + weight_category: WeightCategory; + weight_type: WeightType; + maybe_weight_creator: UserDetailsLight; + maybe_cover_image_public_bucket_path: string; + }; } export enum MediaFileLookupError { @@ -19,34 +30,40 @@ export enum MediaFileLookupError { } export interface GetMediaFileResponse { - success: boolean, - media_file?: MediaFile, + success: boolean; + media_file?: MediaFile; } -export async function GetMediaFile(mediaFileToken: string) : Promise { +export async function GetMediaFile( + mediaFileToken: string +): Promise { const endpoint = new ApiConfig().getMediaFile(mediaFileToken); - - return await fetch(endpoint, { - method: 'GET', - headers: { - 'Accept': 'application/json', - }, - credentials: 'include', - }) - .then(res => res.json()) - .then(res => { - const response : GetMediaFileResponse = res; - if (response && response.success && response.media_file) { - // NB: Timestamps aren't converted to Date objects on their own! - response.media_file.created_at = new Date(response.media_file.created_at); - response.media_file.updated_at = new Date(response.media_file.updated_at); - return response; - } else { - return { success : false }; - } + return await fetch(endpoint, { + method: "GET", + headers: { + Accept: "application/json", + }, + credentials: "include", }) - .catch(e => { - return { success : false }; - }); + .then(res => res.json()) + .then(res => { + const response: GetMediaFileResponse = res; + + if (response && response.success && response.media_file) { + // NB: Timestamps aren't converted to Date objects on their own! + response.media_file.created_at = new Date( + response.media_file.created_at + ); + response.media_file.updated_at = new Date( + response.media_file.updated_at + ); + return response; + } else { + return { success: false }; + } + }) + .catch(e => { + return { success: false }; + }); } diff --git a/packages/components/src/api/weights/GetWeight.ts b/packages/components/src/api/weights/GetWeight.ts index 3e12ab8b0d..6187dbc915 100644 --- a/packages/components/src/api/weights/GetWeight.ts +++ b/packages/components/src/api/weights/GetWeight.ts @@ -5,8 +5,8 @@ import { WeightType } from "../_common/enums/WeightType"; export interface Weight { weight_token: string; - weights_type: WeightType; - weights_category: WeightCategory; + weight_type: WeightType; + weight_category: WeightCategory; title: string; public_bucket_path: string; creator_set_visibility: string; diff --git a/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx b/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx index 6d5bceeb8d..a9406dc41b 100644 --- a/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx +++ b/packages/fakeyou.com/src/components/common/Card/AudioCard/AudioCard.tsx @@ -11,6 +11,7 @@ import { faArrowRight } from "@fortawesome/pro-solid-svg-icons"; import Button from "components/common/Button"; import useWeightTypeInfo from "hooks/useWeightTypeInfo/useWeightTypeInfo"; import WeightCoverImage from "components/common/WeightCoverImage"; +import { BucketConfig } from "@storyteller/components/src/api/BucketConfig"; interface AudioCardProps { bookmarks: any; @@ -30,7 +31,11 @@ export default function AudioCard({ showCover, }: AudioCardProps) { const linkUrl = - type === "media" ? `/media/${data.token}` : `/weight/${data.weight_token}${origin ? "?origin=" + origin + "&ehhh=mehh" : "" }`; + type === "media" + ? `/media/${data.token}` + : `/weight/${data.weight_token || data.details.entity_token}${ + origin ? "?origin=" + origin + "&ehhh=mehh" : "" + }`; const handleInnerClick = (event: any) => { event.stopPropagation(); @@ -44,10 +49,40 @@ export default function AudioCard({ }; const { label: weightBadgeLabel, color: weightBadgeColor } = - useWeightTypeInfo(data.weights_type); + useWeightTypeInfo( + data.weight_type || data.details?.maybe_weight_data?.weight_type + ); + + const bucketConfig = new BucketConfig(); + let coverImage = "/images/avatars/default-pfp.png"; + + if (type === "media") { + coverImage = bucketConfig.getCdnUrl(data.public_bucket_path, 400, 100); + } else if (type === "weights") { + if (data.maybe_cover_image_public_bucket_path) { + coverImage = bucketConfig.getCdnUrl( + data.maybe_cover_image_public_bucket_path, + 100, + 100 + ); + } + if (data.details?.maybe_weight_data?.maybe_cover_image_public_bucket_path) { + coverImage = bucketConfig.getCdnUrl( + data.details?.maybe_weight_data?.maybe_cover_image_public_bucket_path, + 100, + 100 + ); + } + } return ( - console.log("🌠 AUDIO CARD") }}> + console.log("🌠 AUDIO CARD"), + }} + > {type === "media" && ( <> @@ -100,9 +135,7 @@ export default function AudioCard({ {type === "weights" && ( <>
- {showCover && ( - - )} + {showCover && }
@@ -122,7 +155,7 @@ export default function AudioCard({
- {data.title} + {data.title || data.details.maybe_weight_data.title}

{timeAgo}

@@ -153,12 +186,13 @@ export default function AudioCard({
- +
)} 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 6b02607743..b25cae811a 100644 --- a/packages/fakeyou.com/src/components/common/Card/ImageCard/ImageCard.tsx +++ b/packages/fakeyou.com/src/components/common/Card/ImageCard/ImageCard.tsx @@ -12,16 +12,26 @@ import useWeightTypeInfo from "hooks/useWeightTypeInfo/useWeightTypeInfo"; import { BucketConfig } from "@storyteller/components/src/api/BucketConfig"; interface ImageCardProps { - bookmarks: any, + bookmarks: any; data: any; origin?: string; type: "media" | "weights"; showCreator?: boolean; } -export default function ImageCard({ bookmarks, data, origin = "", type, showCreator }: ImageCardProps) { +export default function ImageCard({ + bookmarks, + data, + origin = "", + type, + showCreator, +}: ImageCardProps) { const linkUrl = - type === "media" ? `/media/${data.token}` : `/weight/${data.weight_token}`; + type === "media" + ? `/media/${data.token}` + : `/weight/${data.weight_token || data.details.entity_token}${ + origin ? "?origin=" + origin + "&ehhh=mehh" : "" + }`; const handleInnerClick = (event: any) => { event.stopPropagation(); @@ -35,18 +45,46 @@ export default function ImageCard({ bookmarks, data, origin = "", type, showCrea }; const { label: weightBadgeLabel, color: weightBadgeColor } = - useWeightTypeInfo(data.weights_type); - - const imageLink = new BucketConfig().getGcsUrl(data.public_bucket_path); + useWeightTypeInfo( + data.weight_type || data.details?.maybe_weight_data?.weight_type + ); console.log("🌇", origin); + const bucketConfig = new BucketConfig(); + let coverImage = "/images/avatars/default-pfp.png"; + + if (type === "media") { + coverImage = bucketConfig.getCdnUrl(data.public_bucket_path, 400, 100); + } else if (type === "weights") { + if (data.maybe_cover_image_public_bucket_path) { + coverImage = bucketConfig.getCdnUrl( + data.maybe_cover_image_public_bucket_path, + 400, + 100 + ); + } + if (data.details?.maybe_weight_data?.maybe_cover_image_public_bucket_path) { + coverImage = bucketConfig.getCdnUrl( + data.details?.maybe_weight_data?.maybe_cover_image_public_bucket_path, + 400, + 100 + ); + } + } + return ( - console.log("🌠 IMG CARD") }}> + console.log("🌠 IMG CARD"), + }} + > {type === "media" && ( <> - {data.weight_name} + {data.weight_name}
@@ -96,14 +134,7 @@ export default function ImageCard({ bookmarks, data, origin = "", type, showCrea {type === "weights" && ( <> - {data.title} + {data.title}
@@ -128,7 +159,7 @@ export default function ImageCard({ bookmarks, data, origin = "", type, showCrea
- {data.title} + {data.title || data.details?.maybe_weight_data?.title}

{timeAgo}

@@ -159,11 +190,13 @@ export default function ImageCard({ bookmarks, data, origin = "", type, showCrea
- +
diff --git a/packages/fakeyou.com/src/components/common/ShareButton/ShareButton.tsx b/packages/fakeyou.com/src/components/common/ShareButton/ShareButton.tsx index ed1fe885d2..1351dcda02 100644 --- a/packages/fakeyou.com/src/components/common/ShareButton/ShareButton.tsx +++ b/packages/fakeyou.com/src/components/common/ShareButton/ShareButton.tsx @@ -26,7 +26,7 @@ export default function ShareButton(props: ShareButtonProps) {
{}, token }: Props) { const history = useHistory(); const onChange = ({ target }: { target: { name: string; value: any } }) => { - const todo: { [key: string]: (x: any) => void } = { descriptionMDSet, titleSet, visibilitySet }; + const todo: { [key: string]: (x: any) => void } = { + descriptionMDSet, + titleSet, + visibilitySet, + }; todo[target.name + "Set"](target.value); }; @@ -40,35 +47,30 @@ export default function useWeightFetch({ onRemove = () => {}, token }: Props) { description_rendered_html: data?.description_rendered_html || "", title, visibility, - weight_category: data?.weights_category || "", - weight_type: data?.weights_type || "" + weight_category: data?.weight_category || "", + weight_type: data?.weight_type || "", }) - .then((res: any) => { - console.log("📝",res); - writeStatusSet(FetchStatus.success); - history.replace(`/weight/${ token }`); - }) - .catch(err => { - writeStatusSet(FetchStatus.error); - }); + .then((res: any) => { + writeStatusSet(FetchStatus.success); + history.replace(`/weight/${token}`); + }) + .catch(err => { + writeStatusSet(FetchStatus.error); + }); }; const remove = () => { writeStatusSet(FetchStatus.in_progress); - DeleteWeight(token,{ + DeleteWeight(token, { as_mod: true, - set_delete: true - }) - .then((res: any) => { + set_delete: true, + }).then((res: any) => { writeStatusSet(FetchStatus.success); - console.log("✂️",res); onRemove(res); }); }; const uploadCoverImg = (e: any) => { - console.log("🧲",!!imageProps.file, imgUploadStatus); - // e.stopPropigation(); if (imageProps.file && imgUploadStatus < 2) { imgUploadStatusSet(FetchStatus.in_progress); UploadMedia({ @@ -89,20 +91,23 @@ export default function useWeightFetch({ onRemove = () => {}, token }: Props) { if (token && !data && status === FetchStatus.ready) { statusSet(FetchStatus.in_progress); GetWeight(token, {}) - .then((res: any) => { - let { creator_set_visibility, description_markdown, title: resTitle, ...response } = res; - console.log("🏋️", res, status); - statusSet(FetchStatus.success); - titleSet(resTitle); - descriptionMDSet(description_markdown); - visibilitySet(creator_set_visibility); - setData(response); - }) - .catch(err => { - statusSet(FetchStatus.error); - }); + .then((res: any) => { + let { + creator_set_visibility, + description_markdown, + title: resTitle, + } = res; + statusSet(FetchStatus.success); + titleSet(resTitle); + descriptionMDSet(description_markdown); + visibilitySet(creator_set_visibility); + setData(res); + }) + .catch(err => { + statusSet(FetchStatus.error); + }); } }, [status, token, data]); return { data, fetchError, imgMediaFile, imgMediaFileSet, imageProps, imgUploadStatus, isLoading, descriptionMD, onChange, remove, status, title, update, uploadCoverImg, visibility, writeStatus }; -}; \ No newline at end of file +}; diff --git a/packages/fakeyou.com/src/hooks/useWeightTypeInfo/index.ts b/packages/fakeyou.com/src/hooks/useWeightTypeInfo/index.ts new file mode 100644 index 0000000000..ac07b70e4e --- /dev/null +++ b/packages/fakeyou.com/src/hooks/useWeightTypeInfo/index.ts @@ -0,0 +1 @@ +export { default } from "./useWeightTypeInfo"; diff --git a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/FeaturedTab.tsx b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/FeaturedTab.tsx index 74ae59902a..22236bf888 100644 --- a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/FeaturedTab.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/FeaturedTab.tsx @@ -9,6 +9,8 @@ import { MediaFile } from "@storyteller/components/src/api/media_files/GetMedia" import { useBookmarks, useLazyLists } from "hooks"; import { ListFeaturedMediaFiles } from "@storyteller/components/src/api/media_files/ListFeaturedMediaFiles"; import SkeletonCard from "components/common/Card/SkeletonCard"; +import ImageCard from "components/common/Card/ImageCard"; +import VideoCard from "components/common/Card/VideoCard"; export default function FeaturedTab() { const bookmarks = useBookmarks(); @@ -23,7 +25,7 @@ export default function FeaturedTab() { onInputChange: () => setShowMasonryGrid(false), onSuccess: () => setShowMasonryGrid(true), requestList: true, - addQueries: { page_size: 12 }, + debug: "featured media", }); return ( @@ -55,22 +57,52 @@ export default function FeaturedTab() { gridRef={gridContainerRef} onLayoutComplete={() => console.log("Layout complete!")} > - {media.list.map((data, index) => { - let card = ( - - ); + {media.list.map((data: any, index: number) => { + let card; + switch (data.media_type) { + case "audio": + card = ( + + ); + break; + case "image": + card = ( + + ); + break; + case "video": + card = ( + + ); + break; + default: + card =
Unsupported media type
; + } return (
{card}
diff --git a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx index 7a987fc081..7e921c77c5 100644 --- a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx @@ -33,7 +33,7 @@ export default function MediaTab() { const filterOptions = [ { value: "all", label: "All Media" }, - { value: "images", label: "Images" }, + { value: "image", label: "Images" }, { value: "audio", label: "Audio" }, { value: "video", label: "Video" }, ]; @@ -81,11 +81,14 @@ export default function MediaTab() { next={media.getMore} hasMore={!media.list.length || !!media.next} loader={ -
-
- Loading... + media.list.length !== 0 && + media.isLoading && ( +
+
+ Loading... +
-
+ ) } endMessage={

No more results.

diff --git a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx index dc3a40151e..3540e29c12 100644 --- a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx @@ -117,11 +117,14 @@ export default function WeightsTab() { next={weights.getMore} hasMore={!weights.list.length || !!weights.next} loader={ -
-
- Loading... + weights.list.length !== 0 && + weights.isLoading && ( +
+
+ Loading... +
-
+ ) } endMessage={

No more results.

@@ -155,7 +158,7 @@ export default function WeightsTab() { }} >
); diff --git a/packages/fakeyou.com/src/v2/view/pages/media/MediaImageComponent.tsx b/packages/fakeyou.com/src/v2/view/pages/media/MediaImageComponent.tsx index 07a178e4cf..d47877dab3 100644 --- a/packages/fakeyou.com/src/v2/view/pages/media/MediaImageComponent.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/media/MediaImageComponent.tsx @@ -9,17 +9,10 @@ interface MediaImageComponentProps { export default function MediaImageComponent({ mediaFile, }: MediaImageComponentProps) { - const imagePath = new BucketConfig().getGcsUrl( - mediaFile.public_bucket_path - ); + const imagePath = new BucketConfig().getGcsUrl(mediaFile.public_bucket_path); return (
- test + test
); } diff --git a/packages/fakeyou.com/src/v2/view/pages/media/MediaPage.tsx b/packages/fakeyou.com/src/v2/view/pages/media/MediaPage.tsx index 7b08cc38f7..060905d507 100644 --- a/packages/fakeyou.com/src/v2/view/pages/media/MediaPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/media/MediaPage.tsx @@ -2,7 +2,6 @@ import React, { useCallback, useEffect, useState } from "react"; import { Link, useParams } from "react-router-dom"; import MediaAudioComponent from "./MediaAudioComponent"; import MediaVideoComponent from "./MediaVideoComponent"; -import MediaImageComponent from "./MediaImageComponent"; import { SessionWrapper } from "@storyteller/components/src/session/SessionWrapper"; import { GetMediaFile, @@ -18,8 +17,6 @@ import { faCircleExclamation, faFaceViewfinder, faArrowDownToLine, - // faCirclePlay, - // faShare, faSquareQuote, faShare, faLink, @@ -35,6 +32,11 @@ import WeightCoverImage from "components/common/WeightCoverImage"; import SocialButton from "components/common/SocialButton"; import Modal from "components/common/Modal"; import { Input } from "components/common"; +import LikeButton from "components/common/LikeButton"; +import Badge from "components/common/Badge"; +import useMediaFileTypeInfo from "hooks/useMediaFileTypeInfo"; +import { useBookmarks } from "hooks"; +import SdCoverImagePanel from "../weight/cover_image_panels/SdCoverImagePanel"; interface MediaPageProps { sessionWrapper: SessionWrapper; @@ -67,6 +69,8 @@ export default function MediaPage({ sessionWrapper }: MediaPageProps) { getMediaFile(token); }, [token, getMediaFile]); + const bookmarks = useBookmarks(); + function renderMediaComponent(mediaFile: MediaFile) { switch (mediaFile.media_type) { case MediaFileType.Audio: @@ -107,12 +111,28 @@ export default function MediaPage({ sessionWrapper }: MediaPageProps) { ); case MediaFileType.Image: - return ; + let sdMediaImage = "/images/avatars/default-pfp.png"; + if ( + mediaFile.maybe_model_weight_info && + mediaFile.maybe_model_weight_info + .maybe_cover_image_public_bucket_path !== null + ) { + sdMediaImage = bucketConfig.getGcsUrl( + mediaFile.maybe_model_weight_info + .maybe_cover_image_public_bucket_path + ); + } + return ; default: return
Unsupported media type
; } } + const weightTypeInfo = useMediaFileTypeInfo( + mediaFile?.media_type || MediaFileType.None + ); + const { label: mediaType, color: mediaTagColor } = weightTypeInfo; + let audioLink = new BucketConfig().getGcsUrl(mediaFile?.public_bucket_path); const shareUrl = `https://fakeyou.com/media/${mediaFile?.token || ""}`; @@ -286,9 +306,72 @@ export default function MediaPage({ sessionWrapper }: MediaPageProps) { setTimeout(() => setButtonLabel("Copy"), 1000); }; + const subtitleDivider = |; + + const bucketConfig = new BucketConfig(); + + let weightUsedCoverImage = "/images/avatars/default-pfp.png"; + if (mediaFile.maybe_model_weight_info !== null) { + weightUsedCoverImage = bucketConfig.getCdnUrl( + mediaFile.maybe_model_weight_info.maybe_cover_image_public_bucket_path, + 60, + 100 + ); + } + return (
- + + +
+
+
+

+ {mediaFile.maybe_model_weight_info?.title || + `Media ${mediaType}`} +

+
+
+
+
+ +
+ {subtitleDivider} + + {mediaFile.maybe_model_weight_info && ( + <> +

+ {mediaFile.maybe_model_weight_info?.weight_category} +

+ {subtitleDivider} + + )} + +
+ + {/* */} +
+
+
+
+
+ +
@@ -374,30 +457,46 @@ export default function MediaPage({ sessionWrapper }: MediaPageProps) {

Anonymous

)} -

Created: {timeCreated}

+

Created {timeCreated}

- -
-
Weight Used
-
-
- -
- -
Weight Name
- -

by hanashi

+ {mediaFile.maybe_model_weight_info && ( + +
+
Weight Used
+
+
+ +
+ +
+ {mediaFile.maybe_model_weight_info.title} +
+ +

+ by{" "} + + { + mediaFile.maybe_model_weight_info + .maybe_weight_creator.display_name + } + +

+
-
- + + )} diff --git a/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/BookmarksTab.tsx b/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/BookmarksTab.tsx index 26a873fd94..67a6196e5f 100644 --- a/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/BookmarksTab.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/BookmarksTab.tsx @@ -1,7 +1,6 @@ import React, { useRef, useState } from "react"; -import { useLocation } from 'react-router-dom'; +import { useLocation } from "react-router-dom"; import MasonryGrid from "components/common/MasonryGrid/MasonryGrid"; -import MediaCards from "components/common/Card/MediaCards"; import SkeletonCard from "components/common/Card/SkeletonCard"; import { TempSelect } from "components/common"; import { @@ -12,6 +11,7 @@ import Pagination from "components/common/Pagination"; import { useBookmarks, useListContent } from "hooks"; import { GetBookmarksByUser } from "@storyteller/components/src/api/bookmarks/GetBookmarksByUser"; +import WeightsCards from "components/common/Card/WeightsCards"; export default function BookmarksTab({ username }: { username: string }) { const { pathname: origin } = useLocation(); @@ -164,7 +164,21 @@ export default function BookmarksTab({ username }: { username: string }) { onLayoutComplete={() => console.log("Layout complete!")} > {dataList.map((data: any, key: number) => { - let props = { bookmarks, data, origin, type: "weights" }; + let weightProps = { + bookmarks, + data, + origin, + type: "weights", + showCreator: true, + }; + + // let mediaProps = { + // bookmarks, + // data, + // origin, + // type: "media", + // showCreator: true, + // }; return (
- + + {/* */}
); })} diff --git a/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/WeightsTab.tsx b/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/WeightsTab.tsx index f3b347254e..f40a6b913c 100644 --- a/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/WeightsTab.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/profile/profile_view/tabs/WeightsTab.tsx @@ -43,7 +43,7 @@ export default function WeightsTab({ username }: { username: string }) { addQueries: { page_size: 24 }, }); - console.log("💎",origin); + console.log("💎", origin); const handlePageClick = (selectedItem: { selected: number }) => { weights.pageChange(selectedItem.selected); @@ -178,7 +178,7 @@ export default function WeightsTab({ username }: { username: string }) { }} >
); diff --git a/packages/fakeyou.com/src/v2/view/pages/weight/WeightPage.tsx b/packages/fakeyou.com/src/v2/view/pages/weight/WeightPage.tsx index 11abaee32e..76b9bd22e2 100644 --- a/packages/fakeyou.com/src/v2/view/pages/weight/WeightPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/weight/WeightPage.tsx @@ -67,9 +67,18 @@ export default function WeightPage({ const { weight_token } = useParams<{ weight_token: string }>(); const origin = search ? new URLSearchParams(search).get("origin") : ""; const history = useHistory(); - const { data: weight, descriptionMD, fetchError, isLoading, title, remove } = useWeightFetch({ - onRemove: () => { history.push(origin || ""); }, - token: weight_token + const { + data: weight, + descriptionMD, + fetchError, + isLoading, + title, + remove, + } = useWeightFetch({ + onRemove: () => { + history.push(origin || ""); + }, + token: weight_token, }); const timeUpdated = moment(weight?.updated_at || "").fromNow(); @@ -84,7 +93,7 @@ export default function WeightPage({ const bucketConfig = new BucketConfig(); const weightTypeInfo = useWeightTypeInfo( - weight?.weights_type || WeightType.NONE + weight?.weight_type || WeightType.NONE ); const { label: weightType, @@ -93,7 +102,7 @@ export default function WeightPage({ } = weightTypeInfo; function renderWeightComponent(weight: Weight) { - switch (weight.weights_category) { + switch (weight.weight_category) { case WeightCategory.TTS: return ( ; break; @@ -347,8 +356,8 @@ export default function WeightPage({
- {(weight.weights_category === WeightCategory.VC || - weight.weights_category === WeightCategory.TTS) && ( + {(weight.weight_category === WeightCategory.VC || + weight.weight_category === WeightCategory.TTS) && ( )}