diff --git a/packages/components/src/api/featured_items/CreateFeaturedItem.ts b/packages/components/src/api/featured_items/CreateFeaturedItem.ts new file mode 100644 index 0000000000..e29fa7452c --- /dev/null +++ b/packages/components/src/api/featured_items/CreateFeaturedItem.ts @@ -0,0 +1,20 @@ +import MakeRequest from "../MakeRequest"; + +export interface CreateFeaturedItemRequest { + entity_token: string, + entity_type: string, +} + +export interface CreateFeaturedItemResponse { + success: boolean +} + +export const CreateFeaturedItem = MakeRequest< + string, + CreateFeaturedItemRequest, + CreateFeaturedItemResponse, + {} +>({ + method: "POST", + routingFunction: () => "/v1/featured_item/create", +}); \ No newline at end of file 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 2f240db072..f5d00e7b11 100644 --- a/packages/fakeyou.com/src/v2/view/pages/media/MediaPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/media/MediaPage.tsx @@ -36,13 +36,15 @@ import { useBookmarks, useMedia, useRatings, useSession } from "hooks"; import { WeightCategory } from "@storyteller/components/src/api/_common/enums/WeightCategory"; import SdBatchMediaPanel from "./components/SdBatchMediaPanel/SdBatchMediaPanel"; import { GetMediaBatchImages } from "@storyteller/components/src/api/media_files/GetMediaBatchImages"; +import { CreateFeaturedItem } from "@storyteller/components/src/api/featured_items/CreateFeaturedItem"; import { mediaTypeLabels } from "utils/mediaTypeLabels"; import { EngineMediaPanel } from "./components/EngineMediaPanel/EngineMediaPanel"; import { GetMediaFileTitle } from "common/GetMediaFileTitle"; import { STYLES_BY_KEY } from "common/StyleOptions"; +import { faStarShooting } from "@fortawesome/pro-duotone-svg-icons"; export default function MediaPage() { - const { canAccessStudio, canEditMediaFile, user } = useSession(); + const { canAccessStudio, canEditMediaFile, canBanUsers, user } = useSession(); const { token } = useParams<{ token: string }>(); const bookmarks = useBookmarks(); const ratings = useRatings(); @@ -70,6 +72,8 @@ export default function MediaPage() { mediaFile?.maybe_creator_user?.user_token || "" ); + const viewerCanMakeFeatured = canBanUsers() || false; + // Inside MediaPage.tsx useEffect(() => { @@ -99,6 +103,22 @@ export default function MediaPage() { const deleteMedia = () => remove(!!user?.can_ban_users); + const handleFeatureMedia = async () => { + setFeatureMedia(true); + } + + const setFeatureMedia = async (setFeatured: boolean) => { + if (mediaFile === undefined) { + return; + } + + const request = { + entity_type: "media_file", + entity_token: mediaFile.token + } + await CreateFeaturedItem("", request); + } + const copyToClipboard = async ( text: string, setButtonText: React.Dispatch> @@ -832,6 +852,19 @@ export default function MediaPage() { )} + { viewerCanMakeFeatured && ( + <> +
+
+ + )}