fix(frontend): second round of feedback

Author: alcercu

frontend/src/app/for-lawyers/components/KlerosParticipateSection/index.tsx renamed to frontend/src/app/for-builders/components/KlerosParticipateSection/index.tsx

@@ -10,6 +10,8 @@ import {
 import { request } from "@/utils/graphQLClient";
 import { getPageMetadata } from "@/utils/seo";
 
+import KlerosParticipateSection from "./components/KlerosParticipateSection";
+
 export const generateMetadata = async (): Promise<Metadata> => {
   return await getPageMetadata("forBuildersPageSeo");
 };
@@ -24,6 +26,7 @@ const ForBuilders: React.FC = async () => {
       <UseCasesSection
         {...{ useCasesData: useCasesData.forBuildersPageUseCasesSection }}
       />
+      <KlerosParticipateSection />
     </>
   );
 };

frontend/src/app/for-builders/page.tsx

@@ -5,9 +5,7 @@ import { getPageMetadata } from "@/utils/seo";
 import Hero from "./components/Hero";
 import KlerosDisputeResolutionSection from "./components/KlerosDisputeResolutionSection";
 import KlerosEnterpriseSection from "./components/KlerosEnterpriseSection";
-import KlerosFellowSection from "./components/KlerosFellowSection";
 import KlerosMediationSection from "./components/KlerosMediationSection";
-import KlerosParticipateSection from "./components/KlerosParticipateSection";
 
 export const generateMetadata = async (): Promise<Metadata> => {
   return getPageMetadata("forLawyersPageSeo");
@@ -20,8 +18,6 @@ const ForLawyers: React.FC = async () => {
       <KlerosEnterpriseSection />
       <KlerosMediationSection />
       <KlerosDisputeResolutionSection />
-      <KlerosParticipateSection />
-      <KlerosFellowSection />
     </>
   );
 };

frontend/src/app/for-lawyers/queries/kleros-participation-section.ts renamed to frontend/src/app/for-builders/queries/kleros-participation-section.ts

@@ -10,7 +10,6 @@ import HowKlerosWorks from "./components/HowKlerosWorks";
 import LearnPosts from "./components/LearnPosts";
 import StartEarning from "./components/StartEarning";
 import TrustedBy from "./components/TrustedBy";
-import UseCases from "./components/UseCases";
 
 export const generateMetadata = async (): Promise<Metadata> => {
   return await getPageMetadata("homePageSeo");
@@ -24,7 +23,6 @@ const Home: React.FC = async () => {
       <HowKlerosWorks />
       <LearnPosts />
       <CaseStudies />
-      <UseCases />
       <IntegrateSection listMode />
       <StartEarning />
       <GetInTouch />

frontend/src/app/for-lawyers/page.tsx

@@ -11,8 +11,12 @@ interface IUseCasesSection {
 
 const UseCasesSection: React.FC<IUseCasesSection> = ({ useCasesData }) => {
   return (
-    <div className="relative bg-background-1 px-6 py-16 md:py-24 lg:px-32">
-      <h1 className="mb-8 text-xl font-medium text-primary-text lg:mb-12 lg:text-3xl">
+    <div className="relative bg-background-1 px-6 pt-16 md:pt-24 lg:px-32">
+      <h1
+        className={
+          "mb-8 text-xl font-medium text-primary-text lg:mb-12 lg:text-3xl"
+        }
+      >
         {useCasesData.sectionHeader}
       </h1>
       <UseCasesCards selectedIndex={0} />

frontend/src/app/home/page.tsx

@@ -22,7 +22,7 @@ const FellowCard: React.FC<Fellow> = ({
         width={150}
         height={150}
         src={profilePic.url}
-        className="mb-6 aspect-square object-contain"
+        className="mb-6 aspect-square rounded-2xl object-contain"
         alt="Profile pic"
       />
 

frontend/src/components/ForBuilders/UseCasesSection/index.tsx

@@ -23,7 +23,7 @@ const Fellows: React.FC<{ fellows: Fellow[] }> = ({ fellows }) => {
         itemsPerPage * (page - 1),
         Math.min(fellows.length, itemsPerPage * page),
       ),
-    [itemsPerPage, page],
+    [itemsPerPage, fellows, page],
   );
 
   return (

frontend/src/components/ResearchDevelopment/TabSection/FellowshipTabContent/Fellows/FellowCard.tsx

@@ -1,13 +1,12 @@
 import clsx from "clsx";
 import Image from "next/image";
 
-import ExternalLink from "@/components/ExternalLink";
 import { request } from "@/utils/graphQLClient";
 
 import {
   ForLawyersPageBecomeAFellowSection,
   forLawyersPageBecomeAFellowSectionQuery,
-} from "../../queries/kleros-become-a-fellow-section";
+} from "./queries";
 
 const KlerosFellowSection: React.FC = async () => {
   const {
@@ -16,7 +15,6 @@ const KlerosFellowSection: React.FC = async () => {
     firstSubtitle,
     secondSubtitle,
     fellowImages,
-    arrowLink,
   } = (
     await request<ForLawyersPageBecomeAFellowSection>(
       forLawyersPageBecomeAFellowSectionQuery,
@@ -28,7 +26,7 @@ const KlerosFellowSection: React.FC = async () => {
       className={clsx(
         "bg-background-2",
         "flex flex-col gap-16",
-        "px-6 py-12 lg:px-32 lg:py-24",
+        "py-12 lg:py-24",
       )}
     >
       <div className="flex flex-col gap-8">
@@ -52,12 +50,6 @@ const KlerosFellowSection: React.FC = async () => {
           />
         ))}
       </div>
-
-      <ExternalLink
-        text={arrowLink.text}
-        url={arrowLink.link.url}
-        className="mx-auto"
-      />
     </div>
   );
 };