From af2f1b58bc405a45774980ee0eecb7b7199d4b68 Mon Sep 17 00:00:00 2001
From: BFlat <bombayapirat@gmail.com>
Date: Mon, 31 Jul 2023 20:33:52 +0700
Subject: [PATCH] v2v model page update

---
 .../components/common/PageHeaderModelView.tsx | 34 +++++++++++++++++++
 .../src/components/common/Panel.tsx           |  7 +++-
 .../fakeyou.com/src/v2/view/PageContainer.tsx | 10 ------
 3 files changed, 40 insertions(+), 11 deletions(-)
 create mode 100644 packages/fakeyou.com/src/components/common/PageHeaderModelView.tsx

diff --git a/packages/fakeyou.com/src/components/common/PageHeaderModelView.tsx b/packages/fakeyou.com/src/components/common/PageHeaderModelView.tsx
new file mode 100644
index 0000000000..0a6e561d63
--- /dev/null
+++ b/packages/fakeyou.com/src/components/common/PageHeaderModelView.tsx
@@ -0,0 +1,34 @@
+import React from "react";
+
+interface PageHeaderModelViewProps {
+  titleIcon?: React.ReactNode;
+  title: string;
+  subText: React.ReactNode;
+  tags?: string[];
+}
+
+export default function PageHeaderModelView(props: PageHeaderModelViewProps) {
+  return (
+    <div className="container-panel hero-section pt-3 pb-4">
+      <div className="panel p-3 py-4 p-md-4">
+        <div className="row g-3">
+          <div className="col-12 col-lg-8">
+            <h2 className="fw-bold">
+              {props.titleIcon}
+              {props.title}
+            </h2>
+            <p>{props.subText}</p>
+          </div>
+          <div className="col-12 col-lg-4 d-flex flex-wrap justify-content-lg-end gap-2">
+            {props.tags &&
+              props.tags.map((tag, index) => (
+                <div key={index}>
+                  <span className="badge badge-tag">{tag}</span>
+                </div>
+              ))}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/packages/fakeyou.com/src/components/common/Panel.tsx b/packages/fakeyou.com/src/components/common/Panel.tsx
index 6ad8c5dcf0..8ae8d478ce 100644
--- a/packages/fakeyou.com/src/components/common/Panel.tsx
+++ b/packages/fakeyou.com/src/components/common/Panel.tsx
@@ -5,12 +5,17 @@ import { panel } from "data/animation";
 interface PanelProps {
   children: React.ReactNode;
   padding?: boolean;
+  mb?: boolean;
 }
 
 export default function Panel(props: PanelProps) {
   return (
     <motion.div className="container-panel" variants={panel}>
-      <div className={`panel ${props.padding ? "p-3 py-4 p-md-4" : ""}`}>
+      <div
+        className={`panel ${props.padding ? "p-3 py-4 p-md-4" : ""} ${
+          props.mb ? "mb-4" : ""
+        }`}
+      >
         {props.children}
       </div>
     </motion.div>
diff --git a/packages/fakeyou.com/src/v2/view/PageContainer.tsx b/packages/fakeyou.com/src/v2/view/PageContainer.tsx
index d523ca55a0..896d640401 100644
--- a/packages/fakeyou.com/src/v2/view/PageContainer.tsx
+++ b/packages/fakeyou.com/src/v2/view/PageContainer.tsx
@@ -547,16 +547,6 @@ class PageContainer extends React.Component<Props, State> {
               />
             </Route>
 
-            <Route path="/voice-conversion/:token">
-              <VcModelViewPage
-                sessionWrapper={this.props.sessionWrapper}
-                sessionSubscriptionsWrapper={
-                  this.props.sessionSubscriptionsWrapper
-                }
-                inferenceJobsByCategory={this.props.inferenceJobsByCategory}
-              />
-            </Route>
-
             <Route path="/about">
               <AboutPage />
             </Route>