diff --git a/_redirects b/_redirects index cb8399f97f..81385faefe 100644 --- a/_redirects +++ b/_redirects @@ -43,6 +43,7 @@ /voice-conversion* /index.html 200 /w2l* /index.html 200 /voice-designer* /index.html 200 +/weight* /index.html 200 # Test paths /dev-tts* /index.html 200 diff --git a/packages/components/src/api/_common/enums/WeightsCategory.ts b/packages/components/src/api/_common/enums/WeightCategory.ts similarity index 80% rename from packages/components/src/api/_common/enums/WeightsCategory.ts rename to packages/components/src/api/_common/enums/WeightCategory.ts index 0513342ffc..e0c256eb67 100644 --- a/packages/components/src/api/_common/enums/WeightsCategory.ts +++ b/packages/components/src/api/_common/enums/WeightCategory.ts @@ -1,4 +1,4 @@ -export enum WeightsCategory { +export enum WeightCategory { TTS = "text_to_speech", VOCODER = "vocoder", VC = "voice_conversion", diff --git a/packages/components/src/api/_common/enums/WeightsType.ts b/packages/components/src/api/_common/enums/WeightType.ts similarity index 75% rename from packages/components/src/api/_common/enums/WeightsType.ts rename to packages/components/src/api/_common/enums/WeightType.ts index 6e42f545d2..f4e51c6846 100644 --- a/packages/components/src/api/_common/enums/WeightsType.ts +++ b/packages/components/src/api/_common/enums/WeightType.ts @@ -1,4 +1,4 @@ -export enum WeightsType { +export enum WeightType { TT2 = "tt2", HIFIGAN_TT2 = "hifigan_tt2", RVCv2 = "rvc_v2", @@ -6,4 +6,5 @@ export enum WeightsType { SDXL = "sdxl", SVC = "so_vits_svc", LORA = "loRA", + VALL_E = "vall_e", } diff --git a/packages/components/src/api/weights/GetWeight.ts b/packages/components/src/api/weights/GetWeight.ts index 4374a724ca..b574448113 100644 --- a/packages/components/src/api/weights/GetWeight.ts +++ b/packages/components/src/api/weights/GetWeight.ts @@ -1,17 +1,18 @@ // import MakeRequest from "../MakeRequest"; import { UserDetailsLight } from "../_common/UserDetailsLight"; -import { WeightsCategory } from "../_common/enums/WeightsCategory"; -import { WeightsType } from "../_common/enums/WeightsType"; +import { WeightCategory } from "../_common/enums/WeightCategory"; +import { WeightType } from "../_common/enums/WeightType"; export interface Weight { weight_token: string; - weights_type: WeightsType; - weights_category: WeightsCategory; + weight_type: WeightType; + weight_category: WeightCategory; maybe_creator_user: UserDetailsLight | null; creator_set_visibility: string; created_at: Date; updated_at: Date; title: string; + description_markdown: string; } // export interface GetMediaRequest {} diff --git a/packages/fakeyou.com/src/components/common/Tabs/NonRouteTabs.tsx b/packages/fakeyou.com/src/components/common/Tabs/NonRouteTabs.tsx new file mode 100644 index 0000000000..f9c447f609 --- /dev/null +++ b/packages/fakeyou.com/src/components/common/Tabs/NonRouteTabs.tsx @@ -0,0 +1,83 @@ +import React, { useState } from "react"; +import { useSpring, a } from "@react-spring/web"; +import "./Tabs.scss"; +import { IconDefinition } from "@fortawesome/fontawesome-svg-core"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; + +interface NonRouteTabProps { + label: string; + icon?: IconDefinition; + isActive: boolean; + onClick: () => void; +} + +interface NonRouteTabsProps { + tabs: { + label: string; + content: React.ReactNode; + icon?: IconDefinition; + padding?: boolean; + }[]; +} + +function NonRouteTab({ label, icon, isActive, onClick }: NonRouteTabProps) { + return ( +
  • +
    + {icon && } + {label} +
    +
    • + ); +} + +function NonRouteTabs({ tabs }: NonRouteTabsProps) { + const [activeTab, setActiveTab] = useState(tabs[0].label); + const [fade, setFade] = useSpring(() => ({ + opacity: 1, + from: { opacity: 0 }, + config: { duration: 300 }, + })); + + const handleTabClick = (tabLabel: string) => { + if (tabLabel === activeTab) { + return; + } + + setFade({ opacity: 0 }); + setTimeout(() => { + setActiveTab(tabLabel); + setFade({ opacity: 1 }); + }, 50); + }; + + return ( + + ); +} + +export default NonRouteTabs; diff --git a/packages/fakeyou.com/src/components/common/Tabs/Tabs.scss b/packages/fakeyou.com/src/components/common/Tabs/Tabs.scss index 4e6c0a16d2..9e5c2bba9d 100644 --- a/packages/fakeyou.com/src/components/common/Tabs/Tabs.scss +++ b/packages/fakeyou.com/src/components/common/Tabs/Tabs.scss @@ -11,6 +11,7 @@ font-weight: 500; white-space: nowrap; transition: 0.2s; + cursor: pointer; &:focus { border-bottom: 4px solid transparent; diff --git a/packages/fakeyou.com/src/v2/view/pages/weights/WeightsPage.tsx b/packages/fakeyou.com/src/v2/view/pages/weights/WeightsPage.tsx index e24e523bf8..a0115db042 100644 --- a/packages/fakeyou.com/src/v2/view/pages/weights/WeightsPage.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/weights/WeightsPage.tsx @@ -18,8 +18,8 @@ import DataTable from "components/common/DataTable"; import { Gravatar } from "@storyteller/components/src/elements/Gravatar"; import useTimeAgo from "hooks/useTimeAgo"; import { CommentComponent } from "v2/view/_common/comments/CommentComponent"; -import { WeightsType } from "@storyteller/components/src/api/_common/enums/WeightsType"; -import { WeightsCategory } from "@storyteller/components/src/api/_common/enums/WeightsCategory"; +import { WeightType } from "@storyteller/components/src/api/_common/enums/WeightType"; +import { WeightCategory } from "@storyteller/components/src/api/_common/enums/WeightCategory"; import { SessionVoiceDesignerInferenceResultsList } from "v2/view/_common/SessionVoiceDesignerInferenceResultsList"; import { SessionSubscriptionsWrapper } from "@storyteller/components/src/session/SessionSubscriptionsWrapper"; import { @@ -31,6 +31,13 @@ import TextArea from "components/common/TextArea"; import Badge from "components/common/Badge"; import FavoriteButton from "components/common/FavoriteButton"; import LikeButton from "components/common/LikeButton"; +import NonRouteTabs from "components/common/Tabs/NonRouteTabs"; +import { SessionVoiceConversionResultsList } from "v2/view/_common/SessionVoiceConversionResultsList"; +import SplitPanel from "components/common/SplitPanel"; +// import PitchEstimateMethodComponent from "../vc/vc_model_list/components/PitchEstimateMethodComponent"; +// import PitchShiftComponent from "../vc/vc_model_list/components/PitchShiftComponent"; +// import { SessionVoiceConversionResultsList } from "v2/view/_common/SessionVoiceConversionResultsList"; +// import RecordComponent from "../vc/vc_model_list/components/RecordComponent"; interface WeightProps { sessionWrapper: SessionWrapper; @@ -66,8 +73,8 @@ export default function WeightsPage({ title: "Harry Potter (Daniel Radcliffe)", created_at: new Date(), updated_at: new Date(), - weights_type: WeightsType.TT2, - weights_category: WeightsCategory.TTS, + weight_type: WeightType.TT2, + weight_category: WeightCategory.VC, maybe_creator_user: { user_token: "test", username: "test", @@ -79,6 +86,7 @@ export default function WeightsPage({ }, }, creator_set_visibility: "Public", + description_markdown: "This is a test description", }; // Simulate an API call delay @@ -98,13 +106,13 @@ export default function WeightsPage({ }, [token, getWeight]); function renderWeightComponent(weight: Weight) { - switch (weight.weights_category) { - case WeightsCategory.TTS: + switch (weight.weight_category) { + case WeightCategory.TTS: return (
    -

    Use Voice

    +

    Use Voice