Skip to content

Commit

Permalink
Merge pull request #367 from calabara-hq/cost-optimization
Browse files Browse the repository at this point in the history
Cost optimization #patch
  • Loading branch information
ndodson authored Nov 15, 2024
2 parents cac1ff7 + 5c9adc8 commit c0a06d0
Show file tree
Hide file tree
Showing 933 changed files with 2,337 additions and 36,987 deletions.
2 changes: 2 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
{
}
Binary file modified uplink-client/.yarn/install-state.gz
Binary file not shown.
5 changes: 0 additions & 5 deletions uplink-client/next.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,6 @@ const nextConfig = {
contentDispositionType: 'attachment',
contentSecurityPolicy: "default-src 'self'; script-src 'none'; sandbox;",
remotePatterns: [
{
protocol: 'https',
hostname: 'res.cloudinary.com',
port: '',
},
{
protocol: 'https',
hostname: 'calabara.mypinata.cloud',
Expand Down
2 changes: 2 additions & 0 deletions uplink-client/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,7 @@
"next-mdx-remote": "^5.0.0",
"node-gyp": "^10.0.1",
"popmotion": "^11.0.5",
"probe-image-size": "^7.2.3",
"react": "^18",
"react-day-picker": "^8.9.1",
"react-dom": "^18",
Expand Down Expand Up @@ -103,6 +104,7 @@
"@storybook/testing-library": "^0.2.1",
"@tailwindcss/typography": "^0.5.14",
"@types/node": "^20",
"@types/probe-image-size": "^7",
"@types/react": "^18",
"@types/react-dom": "^18",
"@types/react-lazyload": "^3",
Expand Down
422 changes: 0 additions & 422 deletions uplink-client/src/app/(home)/feature.tsx

Large diffs are not rendered by default.

22 changes: 9 additions & 13 deletions uplink-client/src/app/(home)/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,22 +4,20 @@ import Link from "next/link";
import ArtistPfp from "@/../public/pumey_pfp.jpg";
import ArtistSubmission from "@/../public/vinnie_noggles.png";
import landingBg from "@/../public/landing-bg.svg";
import UplinkImage from "@/lib/UplinkImage";
import { ContestSubCardA, FeatureCard } from "./feature";
import { Button } from "@/ui/DesignKit/Button";
import { FaCircle, FaPalette } from "react-icons/fa";
import { LuCoins } from "react-icons/lu";
import { PiInfinity } from "react-icons/pi";
import { ChainLabel } from "@/ui/ContestLabels/ContestLabels";
import { ChainLabel } from "@/ui/ChainLabel/ChainLabel";
import { RenderMintMedia } from "@/ui/Token/MintUtils";
import { ImageWrapper } from "@/ui/Submission/MediaWrapper";
import { ImageWrapper } from "@/app/(legacy)/contest/components/MediaWrapper";
import { MdAccessibility, MdDashboardCustomize, MdGroups } from "react-icons/md";
import OptimizedImage from "@/lib/OptimizedImage";

export const dynamic = 'force-static';
export const runtime = 'nodejs';



const BannerSection = () => {
return (
<div className="w-full h-screen min-h-[750px] flex-grow flex flex-col relative">
Expand Down Expand Up @@ -109,28 +107,26 @@ const BannerSection = () => {
<FaCircle className="text-green-500 w-4 h-4" />
</div>
<div className="grid grid-cols-[32px_auto] md:grid-cols-[64px_auto] p-4">
<UplinkImage
<Image
src={ArtistPfp}
alt="swim shady"
width={50}
height={50}
sizes="10vw"
className="rounded-full"
blur={false}
/>
<div className="flex-grow flex flex-col gap-2 ml-4">
<p className="text-t1">
<span className="text-primary11">@vinniehager</span> noggles!
</p>
<div className="flex-grow flex flex-col items-center">
<div className="relative w-full">
<UplinkImage
<Image
src={ArtistSubmission}
alt="twitter submission"
className="rounded-lg object-contain"
width={600}
priority
blur={false}
/>
</div>
<div className="text-sm text-t2 italic font-[500] self-start text-left">
Expand Down Expand Up @@ -207,7 +203,7 @@ export default async function Page() {
<div className="flex items-center text-sm text-t2 bg-base rounded-lg p-1 pr-2 w-fit">
<div style={{ width: '28px' }}>
<ImageWrapper>
<UplinkImage src="https://uplink.mypinata.cloud/ipfs/QmP4anosdNmt4PdGTF134UxUrxcJq9TCWbTSaMy98jubPP" alt="avatar" className="rounded-lg" fill blur sizes="5vw" />
<OptimizedImage src="https://uplink.mypinata.cloud/ipfs/QmP4anosdNmt4PdGTF134UxUrxcJq9TCWbTSaMy98jubPP" alt="avatar" className="rounded-lg" fill sizes="5vw" />
</ImageWrapper>
</div>
<span className="font-bold italic">LGHT</span>
Expand Down Expand Up @@ -298,7 +294,7 @@ export default async function Page() {

<div className="grid grid-cols-[10%_90%] gap-4 border border-border bg-base-100 rounded-lg p-4 shadow-base shadow-lg">
<div className="w-8 h-8 relative">
<UplinkImage
<OptimizedImage
src="https://uplink.mypinata.cloud/ipfs/QmdGYCdb3kkYXkq9vyhy9GecqycU5FVJmbUvbUxmAv15dh"
alt="avatar"
fill
Expand All @@ -313,7 +309,7 @@ export default async function Page() {

<div className="grid grid-cols-[10%_90%] gap-4 border border-border bg-base-100 rounded-lg p-4 shadow-base shadow-lg">
<div className="w-8 h-8 relative">
<UplinkImage
<OptimizedImage
src="https://uplink.mypinata.cloud/ipfs/QmarNQN7VJCJjf92TMboiZc7PoNAfPiXd9C9XrDyo2NvjZ"
alt="avatar"
fill
Expand All @@ -334,7 +330,7 @@ export default async function Page() {
</div>
<div className="grid grid-cols-[10%_90%] gap-4 border border-border bg-base-100 rounded-lg p-4 shadow-base shadow-lg">
<div className="w-8 h-8 relative">
<UplinkImage
<OptimizedImage
src="https://uplink.mypinata.cloud/ipfs/QmNg9H3quJXkJREVgnfUgLgdc767cCiwsb34uoP9XHGngE"
alt="avatar"
fill
Expand Down
30 changes: 30 additions & 0 deletions uplink-client/src/app/(legacy)/contest/[id]/client.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
"use client";
import { useState } from "react";
import { Modal } from "@/ui/Modal/Modal";

export const ExpandSection = ({
data,
label,
children,
}: {
data: any[];
label: string;
children: React.ReactNode;
}) => {
const [isModalOpen, setIsModalOpen] = useState(false);
return (
<div>
{data.length > 3 && (
<a
className="hover:underline text-blue-500 cursor-pointer"
onClick={() => setIsModalOpen(true)}
>
{label}
</a>
)}
<Modal isModalOpen={isModalOpen} onClose={() => setIsModalOpen(false)} className="w-full max-w-[500px]">
{children}
</Modal>
</div>
);
};
43 changes: 43 additions & 0 deletions uplink-client/src/app/(legacy)/contest/[id]/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
import fetchLegacyContest from "@/lib/fetch/fetchLegacyContest";
import { LegacyContestWithPrompt } from "@/types/contest";
import { Metadata } from "next";


export async function generateMetadata({
params,
}: {
params: { id: string };
}): Promise<Metadata> {
const contest: LegacyContestWithPrompt = await fetchLegacyContest(params.id).then(async data => {
const promptData = await fetch(data.promptUrl).then(res => res.json());
return { ...data, promptData };
});

return {
title: `${contest.promptData.title} on Uplink`,
description: `${contest.promptData.title} on Uplink`,
openGraph: {
title: `${contest.promptData.title}`,
description: `${contest.promptData.title} on Uplink`,
images: [
{
url: `api/contest/${params.id}/contest_metadata`,
width: 600,
height: 600,
alt: `contest logo`,
},
],
locale: "en_US",
type: "website",
},
};
}


export default function Layout({ children }: { children: React.ReactNode }) {
return (
<div className="relative w-full flex flex-col items-center p-4">
{children}
</div>
)
}
123 changes: 123 additions & 0 deletions uplink-client/src/app/(legacy)/contest/[id]/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,123 @@
import {
ContestHeadingSkeleton,
} from "@/ui/ContestHeading/ContestHeading";
import { Suspense } from "react";
import fetchLegacyContest from "@/lib/fetch/fetchLegacyContest";
import Link from "next/link";
import OptimizedImage from "@/lib/OptimizedImage";
import { ChannelStateLabel } from "@/ui/ChannelSidebar/SidebarUtils";
import ExpandableTextSection from "@/ui/ExpandableTextSection/ExpandableTextSection";
import ParseBlocks from "@/lib/blockParser";
import { ImageWrapper } from "@/app/(legacy)/contest/components/MediaWrapper";
import { LiveSubmissionDisplay, SubmissionDisplaySkeleton } from "@/app/(legacy)/contest/components/SubmissionDisplay";
import { DetailsSkeleton } from "@/ui/ChannelSidebar/ContestDetailsV2";
import ContestDetails from "@/app/(legacy)/contest/components/ContestDetails";

const SubmissionWrapper = async ({
contestId,
}: {
contestId: string;
}) => {
const contest = await fetchLegacyContest(contestId);

return <LiveSubmissionDisplay contestId={contestId} submissions={contest.submissions} />

};


const LegacyContestHeading = async ({ contestId }: { contestId: string }) => {


const contest = await fetchLegacyContest(contestId).then(async (res) => {
const promptData = await fetch(res.promptUrl).then((res) => res.json());
return { ...res, prompt: promptData };
})

const { prompt, space, metadata } = contest;

return (
<div className="grid grid-cols-1 w-full gap-2">
<div className="w-full ml-auto ">
<div className="grid grid-cols-1 sm:grid-cols-[auto_25%] gap-6 w-full p-4">
<div className="flex flex-col gap-2 break-words">
<h2 className="lg:text-3xl text-xl font-[600] text-t1">
{prompt.title}
</h2>
<div className="flex flex-row gap-2 items-center">
<Link
className="relative w-8 h-8 flex flex-col"
href={`/${space.name}`}
draggable={false}
>
<OptimizedImage
src={space.logoUrl}
alt="Org Avatar"
fill
className="rounded-full object-cover"
/>
</Link>
<Link
className="text-sm text-t2 hover:underline hover:text-t1"
href={`/${space.name}`}
draggable={false}
>
{space.displayName}
</Link>
<ChannelStateLabel channelState="complete" />

</div>
<div className="grid grid-cols-1">
<ExpandableTextSection>
<ParseBlocks data={prompt.body} omitImages={false} />
</ExpandableTextSection>
</div>
</div>
<div className="grid grid-cols-1 items-start w-full gap-2">
{prompt.coverUrl && (
<ImageWrapper>
<OptimizedImage
src={prompt.coverUrl}
alt="contest image"
sizes="20vw"
fill
className="object-contain rounded-xl"
/>
</ImageWrapper>
)}
</div>
</div>
</div>
<div className="w-full h-0.5 bg-base-100" />
</div>
);
};




export default async function Page({ params }: { params: { id: string } }) {

const contestId = params.id;

return (
<div className="flex gap-6 m-auto w-full lg:w-[90vw]">
<div className="flex flex-col w-full gap-4 transition-all duration-200 ease-in-out">
<Suspense fallback={<ContestHeadingSkeleton />}>
<LegacyContestHeading contestId={contestId} />
</Suspense>

<Suspense fallback={<SubmissionDisplaySkeleton />}>
<SubmissionWrapper contestId={contestId} />
</Suspense>
</div>
<div className="hidden lg:block sticky top-3 right-0 w-full max-w-[450px] flex-grow h-full">
<div className="flex flex-col gap-2 w-full border border-border bg-base-100 rounded-lg">
<Suspense fallback={<DetailsSkeleton />}>
<ContestDetails contestId={contestId} />
</Suspense>
</div>
</div>
</div>
);
}

Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,14 @@ import { useInView } from "react-intersection-observer";
import React, { useEffect, useState } from "react";
import { isMobile } from "@/lib/isMobile";
import dynamic from "next/dynamic";
import { UsernameDisplay, UserAvatar } from "../AddressDisplay/AddressDisplay";
import { UsernameDisplay, UserAvatar } from "../../../../ui/AddressDisplay/AddressDisplay";
import { ImageWrapper } from "./MediaWrapper";
import { TbCrown } from "react-icons/tb";
import { ParseThread } from "@/lib/threadParser";
import { RenderInteractiveVideoWithLoader } from "@/ui/VideoPlayer";
import { Decimal } from "decimal.js";
import formatDecimal from "@/lib/formatDecimal";
import UplinkImage from "@/lib/UplinkImage"
import OptimizedImage from "@/lib/OptimizedImage"

const ParseBlocks = dynamic(() => import("@/lib/blockParser"), {
ssr: false,
Expand Down Expand Up @@ -103,7 +103,7 @@ const RenderVideoSubmission = ({
const RenderImageSubmission = ({ submission }) => {
return (
<ImageWrapper>
<UplinkImage
<OptimizedImage
src={
submission.type === "standard"
? submission.data.previewAsset
Expand Down
Loading

0 comments on commit c0a06d0

Please sign in to comment.