diff --git a/app/[lang]/projects/page.tsx b/app/[lang]/projects/page.tsx index 2ab48c42..856ce321 100644 --- a/app/[lang]/projects/page.tsx +++ b/app/[lang]/projects/page.tsx @@ -1,7 +1,7 @@ import { Metadata } from "next" import ProjectFiltersBar from "@/components/project/project-filters-bar" -import ProjectList from "@/components/project/project-list" +import { ProjectList } from "@/components/project/project-list" import { ProjectResultBar } from "@/components/project/project-result-bar" import { useTranslation } from "@/app/i18n" diff --git a/app/i18n/locales/en/common.json b/app/i18n/locales/en/common.json index 15399eac..55f6681c 100644 --- a/app/i18n/locales/en/common.json +++ b/app/i18n/locales/en/common.json @@ -45,8 +45,9 @@ "fullyPSE": "Fully PSE" }, "status": { - "archived": "Archived", - "active": "Active" + "archived": "Inactive", + "active": "Active", + "inactive": "Inactive" }, "sortBy": "Sort by: {{option}}", "tryItOut": "Try it out!", diff --git a/app/i18n/locales/it/common.json b/app/i18n/locales/it/common.json index f463a269..efe2051e 100644 --- a/app/i18n/locales/it/common.json +++ b/app/i18n/locales/it/common.json @@ -40,7 +40,8 @@ }, "status": { "archived": "Archiviato", - "active": "Attivo" + "active": "Attivo", + "inactive": "Inattivo" }, "sortBy": "Ordina per: {{option}}", "tryItOut": "Prova!", @@ -63,4 +64,4 @@ "whatDoYouWantDoToday": "Cosa vuoi fare oggi?", "showingProjects": "Mostrando {{count}} progetti", "showingProjectsWith": "Mostrando {{count}} progetti con:" -} +} \ No newline at end of file diff --git a/components/project/project-card.tsx b/components/project/project-card.tsx index f2cadb53..06a1a2af 100644 --- a/components/project/project-card.tsx +++ b/components/project/project-card.tsx @@ -67,10 +67,10 @@ export default function ProjectCard({ alt={`${name} banner`} width={1200} height={630} - className="min-h-[160px] w-full rounded-t-lg object-cover" + className="min-h-[160px] w-full overflow-hidden rounded-t-lg border-none object-cover" /> {!image && ( - + {imageAlt || name} )} diff --git a/components/project/project-filters-bar.tsx b/components/project/project-filters-bar.tsx index 387a6e08..b4e31aba 100644 --- a/components/project/project-filters-bar.tsx +++ b/components/project/project-filters-bar.tsx @@ -69,7 +69,7 @@ export const ThemesStatusMapping = (lang: LocaleTypes): IThemeStatus => { icon: , }, archived: { - label: t("status.archived"), + label: t("status.inactive"), icon: , }, } diff --git a/components/project/project-list.tsx b/components/project/project-list.tsx index 06f819a7..eedfb08a 100644 --- a/components/project/project-list.tsx +++ b/components/project/project-list.tsx @@ -4,12 +4,19 @@ import React from "react" import Image from "next/image" import NoResultIcon from "@/public/icons/no-result.svg" import { useProjectFiltersState } from "@/state/useProjectFiltersState" +import { cva } from "class-variance-authority" import { LangProps } from "@/types/common" +import { ProjectSection, ProjectSections } from "@/lib/types" +import { cn } from "@/lib/utils" import { useTranslation } from "@/app/i18n/client" import ProjectCard from "./project-card" +const sectionTitleClass = cva( + "relative font-sans text-base font-bold uppercase tracking-[3.36px] text-anakiwa-950 after:ml-8 after:absolute after:top-1/2 after:h-[1px] after:w-full after:translate-y-1/2 after:bg-anakiwa-300 after:content-['']" +) + const NoResults = ({ lang }: LangProps["params"]) => { const { t } = useTranslation(lang, "common") @@ -28,7 +35,15 @@ const NoResults = ({ lang }: LangProps["params"]) => { ) } -export default function ProjectList({ lang }: LangProps["params"]) { +const ProjectSectionLabelMapping: Record = { + pse: "PSE projects", + grant: "Grants", + collaboration: "Collaborations", +} + +export const ProjectList = ({ lang }: LangProps["params"]) => { + const { t } = useTranslation(lang, "common") + const { t: tResource } = useTranslation(lang, "resources-page") const { projects } = useProjectFiltersState((state) => state) const noItems = projects?.length === 0 @@ -36,17 +51,60 @@ export default function ProjectList({ lang }: LangProps["params"]) { if (noItems) return return ( -
- {projects.map((project) => ( - - ))} +
+
+ {ProjectSections.map((section) => { + const sectionProjects = + projects.filter( + (project) => + project.section?.toLowerCase() === section?.toLowerCase() + ) ?? [] + + const hasProjectsForSection = sectionProjects.length > 0 + + const sectionTitle = + ProjectSectionLabelMapping[section as ProjectSection] + + return ( +
+
+
+

{sectionTitle}

+
+
+ {hasProjectsForSection ? ( + sectionProjects.map((project) => ( + + )) + ) : ( + {t("noResults")} + )} +
+
+
+ ) + })} +
+ +
+
+
+ {tResource("onThisPage")} +
+
+
) } diff --git a/components/ui/anchor-list.tsx b/components/ui/anchor-list.tsx new file mode 100644 index 00000000..8d74893b --- /dev/null +++ b/components/ui/anchor-list.tsx @@ -0,0 +1,15 @@ +import { useTranslation } from "@/app/i18n" + +interface AnchorListProps { + lang: string +} + +const AnchorList = ({ lang }: AnchorListProps) => { + const { t } = useTranslation(lang, "resources-page") + + return
+} + +AnchorList.displayName = "AnchorList" + +export { AnchorList } diff --git a/data/projects.ts b/data/projects.ts index cc61dafc..c6301a14 100644 --- a/data/projects.ts +++ b/data/projects.ts @@ -78,9 +78,6 @@ export const projects: ProjectInterface[] = [ p0tion, jubmoji, nfctap, - /** - * Grant projects hidden until we have grant tag zkp2p, zk3, - */ ] diff --git a/data/projects/p0tion.ts b/data/projects/p0tion.ts index d98d6227..7c0e8dcf 100644 --- a/data/projects/p0tion.ts +++ b/data/projects/p0tion.ts @@ -6,8 +6,9 @@ p0tion is an agnostic-from-ceremony public good toolkit, with the aim of making export const p0tion: ProjectInterface = { id: "p0tion", + section: "pse", projectStatus: "active", - image: "", + image: "p0tion.png", name: "p0tion", tldr: "Toolkit for Groth16 Phase 2 Trusted Setup ceremonies.", description, @@ -16,10 +17,7 @@ export const p0tion: ProjectInterface = { github: "https://github.com/privacy-scaling-explorations/p0tion", }, tags: { - keywords: [ - "Toolkits", - "Infrastructure/protocol" - ], + keywords: ["Toolkits", "Infrastructure/protocol"], themes: ["build"], types: ["Legos/dev tools"], builtWith: [], diff --git a/data/projects/p256.ts b/data/projects/p256.ts index 02e71c57..33389459 100644 --- a/data/projects/p256.ts +++ b/data/projects/p256.ts @@ -6,6 +6,7 @@ P256 is an ERC-4337 smart contract wallet that leverages zk-SNARKs for WebAuthn export const p256: ProjectInterface = { id: "p256", + section: "pse", projectStatus: "active", image: "", name: "P256", diff --git a/data/projects/pollen-labs.ts b/data/projects/pollen-labs.ts index 60816ae1..c0216188 100644 --- a/data/projects/pollen-labs.ts +++ b/data/projects/pollen-labs.ts @@ -6,6 +6,7 @@ Pollen Labs is driven by a mission to make a significant impact on global lives export const pollenLabs: ProjectInterface = { id: "pollen-labs", + section: "pse", projectStatus: "active", image: "pollen-labs.svg", name: "Pollen Labs", diff --git a/data/projects/powers-of-tau.ts b/data/projects/powers-of-tau.ts index 026de83e..48c209ba 100644 --- a/data/projects/powers-of-tau.ts +++ b/data/projects/powers-of-tau.ts @@ -1,23 +1,28 @@ -import { ProjectInterface } from "@/lib/types"; +import { ProjectInterface } from "@/lib/types" export const PerpetualPowersOfTau: ProjectInterface = { id: "perpetual-powers-of-tau", - image: "", + section: "pse", + image: "powers-of-tau.png", name: "Perpetual Powers of Tau", - tldr: 'An ongoing (since 2019) zk-SNARK trusted setup ceremony for circuits up to 2^28 constraints.', - description: "The Perpetual Powers of Tau is a multi-party trusted setup ceremony, rooted in the Zcash Powers of Tau. Its primary objective is the secure generation of zk-SNARK parameters for circuits accommodating up to 2^28 (260+ million) constraints. This translates to the creation of over 530 million powers of tau. The ceremony's integrity hinges on the principle that as long as one participant acts honestly and remains uncompromised, the entire setup remains trustworthy. It's a pivotal step for zk-SNARK projects, ensuring the security and privacy of the system. Those who can handle a 100Gb download and many hours of compute time are invited to join by contacting [@glamperd on Twitter](https://twitter.com/glamperd) or Telegram, or asking questions via the PSE [Discord](https://discord.com/invite/sF5CT5rzrR).", - projectStatus: 'active', + tldr: "An ongoing (since 2019) zk-SNARK trusted setup ceremony for circuits up to 2^28 constraints.", + description: + "The Perpetual Powers of Tau is a multi-party trusted setup ceremony, rooted in the Zcash Powers of Tau. Its primary objective is the secure generation of zk-SNARK parameters for circuits accommodating up to 2^28 (260+ million) constraints. This translates to the creation of over 530 million powers of tau. The ceremony's integrity hinges on the principle that as long as one participant acts honestly and remains uncompromised, the entire setup remains trustworthy. It's a pivotal step for zk-SNARK projects, ensuring the security and privacy of the system. Those who can handle a 100Gb download and many hours of compute time are invited to join by contacting [@glamperd on Twitter](https://twitter.com/glamperd) or Telegram, or asking questions via the PSE [Discord](https://discord.com/invite/sF5CT5rzrR).", + projectStatus: "active", tags: { - keywords: ['scaling'] + keywords: ["scaling"], }, links: { - github: 'https://github.com/privacy-scaling-explorations/perpetualpowersoftau', - website: 'https://perpetualpowersoftau.com/' + github: + "https://github.com/privacy-scaling-explorations/perpetualpowersoftau", + website: "https://perpetualpowersoftau.com/", }, extraLinks: { - learn: [{ - label: 'Announcing the Perpetual Powers of Tau Ceremony', - url: 'https://medium.com/coinmonks/announcing-the-perpetual-powers-of-tau-ceremony-to-benefit-all-zk-snark-projects-c3da86af8377' - }], + learn: [ + { + label: "Announcing the Perpetual Powers of Tau Ceremony", + url: "https://medium.com/coinmonks/announcing-the-perpetual-powers-of-tau-ceremony-to-benefit-all-zk-snark-projects-c3da86af8377", + }, + ], }, } diff --git a/data/projects/pse-security.ts b/data/projects/pse-security.ts index 074473f4..f2e87aca 100644 --- a/data/projects/pse-security.ts +++ b/data/projects/pse-security.ts @@ -6,8 +6,9 @@ PSE Security is a division of the Privacy & Scaling Explorations team at the Eth export const pseSecurity: ProjectInterface = { id: "pse-security", + section: "pse", projectStatus: "active", - image: "", + image: "pse-security.png", name: "PSE Security", tldr: "Proactively securing Ethereum's L2 and ZK ecosystems.", description, diff --git a/data/projects/rln.ts b/data/projects/rln.ts index 7fe248b6..138e6714 100644 --- a/data/projects/rln.ts +++ b/data/projects/rln.ts @@ -6,6 +6,7 @@ Rate-Limiting Nullifier (RLN) is a protocol designed to combat spam and denial o export const rln: ProjectInterface = { id: "rln", + section: "pse", projectStatus: "active", image: "rln.svg", name: "Rate-Limiting Nullifier", diff --git a/data/projects/semaphore.ts b/data/projects/semaphore.ts index 0a073ee0..83595939 100644 --- a/data/projects/semaphore.ts +++ b/data/projects/semaphore.ts @@ -6,6 +6,7 @@ Semaphore is a protocol that allows users to prove their membership in a group a export const semaphore: ProjectInterface = { id: "semaphore", + section: "pse", projectStatus: "active", image: "semaphore.webp", name: "Semaphore", diff --git a/data/projects/summa.ts b/data/projects/summa.ts index a1dbdea2..d6f1064d 100644 --- a/data/projects/summa.ts +++ b/data/projects/summa.ts @@ -6,6 +6,7 @@ Summa allows centralized exchanges to demonstrate that their assets exceed their export const summa: ProjectInterface = { id: "summa", + section: "pse", projectStatus: "active", image: "summa.svg", name: "Summa", diff --git a/data/projects/tlsn.ts b/data/projects/tlsn.ts index 3101be02..fec4d315 100644 --- a/data/projects/tlsn.ts +++ b/data/projects/tlsn.ts @@ -8,6 +8,7 @@ TLSNotary is ideal for developers of privacy-focused projects that require **dat export const tlsn: ProjectInterface = { id: "tlsn", + section: "pse", projectStatus: "active", image: "tlsn.webp", name: "TLSNotary", @@ -26,12 +27,12 @@ export const tlsn: ProjectInterface = { "Plugin", "Application", ], - builtWith: ['rust'], + builtWith: ["rust"], keywords: [ "Anonymity/privacy", "Identity", "Reputation", - "Data portability" + "Data portability", ], }, } diff --git a/data/projects/trusted-setups.ts b/data/projects/trusted-setups.ts index e08b7928..be213e42 100644 --- a/data/projects/trusted-setups.ts +++ b/data/projects/trusted-setups.ts @@ -5,6 +5,7 @@ The Trusted Setups project is dedicated to simplifying the process of trusted se ` export const trustedSetups: ProjectInterface = { id: "trusted-setups", + section: "pse", projectStatus: "active", image: "trusted-setups.svg", name: "Trusted Setups", diff --git a/data/projects/unirep-protocol.ts b/data/projects/unirep-protocol.ts index 04728cd6..b989b3e9 100644 --- a/data/projects/unirep-protocol.ts +++ b/data/projects/unirep-protocol.ts @@ -8,6 +8,7 @@ Using anonymous identifiers (epoch keys), the protocol allows for trustless enga export const unirepProtocol: ProjectInterface = { id: "unirep-protocol", + section: "pse", projectStatus: "active", image: "unirep.svg", name: "UniRep Protocol", diff --git a/data/projects/wax.ts b/data/projects/wax.ts index a9a09ca2..89f76b04 100644 --- a/data/projects/wax.ts +++ b/data/projects/wax.ts @@ -12,6 +12,7 @@ The primary use cases for WAX include scaling, key management, and the creation export const wax: ProjectInterface = { id: "wax", + section: "pse", projectStatus: "active", image: "wax.webp", name: "Wallet Account eXperiments - WAX", diff --git a/data/projects/zk-kit.ts b/data/projects/zk-kit.ts index 98213c89..d01c930d 100644 --- a/data/projects/zk-kit.ts +++ b/data/projects/zk-kit.ts @@ -1,20 +1,22 @@ -import { ProjectInterface } from "@/lib/types"; +import { ProjectInterface } from "@/lib/types" export const ZKKit: ProjectInterface = { - id: "zk-kit", - image: "zk-kit.svg", - name: "ZK-kit", - tldr: "A monorepo of reusable libraries for zero-knowledge technologies.", - description: "ZK-kit is a set of libraries (plugins, algorithms or utility functions) that can be reused in different projects and zero-knowledge protocols, making it easier for developers to access user-friendly, tested, and documented libraries.", - projectStatus: 'active', - links: { - website: 'https://zkkit.pse.dev', - github: 'https://github.com/privacy-scaling-explorations/zk-kit', - }, - tags: { - keywords: ['Education', 'Toolkits', 'Anonymity/Privacy', 'Algorithms'], - themes: ["build"], - types: ["Legos/dev tools"], - builtWith: ["Circom", "JavaScript", "Solidity", "Noir"] - } + id: "zk-kit", + section: "pse", + image: "zk-kit.svg", + name: "ZK-kit", + tldr: "A monorepo of reusable libraries for zero-knowledge technologies.", + description: + "ZK-kit is a set of libraries (plugins, algorithms or utility functions) that can be reused in different projects and zero-knowledge protocols, making it easier for developers to access user-friendly, tested, and documented libraries.", + projectStatus: "active", + links: { + website: "https://zkkit.pse.dev", + github: "https://github.com/privacy-scaling-explorations/zk-kit", + }, + tags: { + keywords: ["Education", "Toolkits", "Anonymity/Privacy", "Algorithms"], + themes: ["build"], + types: ["Legos/dev tools"], + builtWith: ["Circom", "JavaScript", "Solidity", "Noir"], + }, } diff --git a/data/projects/zk3.ts b/data/projects/zk3.ts index 1b4feb5c..ef74b958 100644 --- a/data/projects/zk3.ts +++ b/data/projects/zk3.ts @@ -6,6 +6,7 @@ Zk3 is a protocol that leverages Zero Knowledge Proofs (ZKPs) to allow users to export const zk3: ProjectInterface = { id: "zk3", + section: "grant", projectStatus: "active", image: "zk3.svg", name: "zk3", diff --git a/data/projects/zkevm-community.ts b/data/projects/zkevm-community.ts index 0afc631a..68a0c9af 100644 --- a/data/projects/zkevm-community.ts +++ b/data/projects/zkevm-community.ts @@ -6,8 +6,9 @@ zkEVM Community Edition is a project aimed at validating Ethereum blocks using z export const zkevmCommunity: ProjectInterface = { id: "zkevm-community", + section: "pse", projectStatus: "active", - image: "", + image: "zkevm.jpg", name: "zkEVM Community Edition", tldr: "A zero-knowledge proof mechanism for Ethereum block verification.", description, diff --git a/data/projects/zkitter.ts b/data/projects/zkitter.ts index f6078738..f16914c8 100644 --- a/data/projects/zkitter.ts +++ b/data/projects/zkitter.ts @@ -6,6 +6,7 @@ Zkitter is a decentralized social network that emphasizes privacy by default. It export const zkitter: ProjectInterface = { id: "zkitter", + section: "pse", projectStatus: "archived", image: "zkitter.webp", name: "Zkitter", diff --git a/data/projects/zkml.ts b/data/projects/zkml.ts index 6c7e43bb..133d6c75 100644 --- a/data/projects/zkml.ts +++ b/data/projects/zkml.ts @@ -6,8 +6,9 @@ ZKML is a solution that combines the power of zero-knowledge proofs (ZKPs) and m export const zkml: ProjectInterface = { id: "zkml", + section: "pse", projectStatus: "active", - image: "", + image: "zkml.png", name: "ZKML", tldr: "ZKML (Zero-Knowledge Machine Learning) leverages zero-knowledge proofs for privacy-preserving machine learning, enabling model and data privacy with transparent verification.", description, diff --git a/data/projects/zkopru.ts b/data/projects/zkopru.ts index 7e212c70..5c06bb0f 100644 --- a/data/projects/zkopru.ts +++ b/data/projects/zkopru.ts @@ -1,27 +1,32 @@ -import { ProjectInterface } from "@/lib/types"; +import { ProjectInterface } from "@/lib/types" export const Zkopru: ProjectInterface = { - id: "zkopru", - image: "zkopru.svg", - name: "ZKOPRU", - tldr: "Optimistic Rollup with zk-SNARKs for private Ethereum transactions.", - description: "ZKOPRU is one of the initial projects of EF's PSE team. It is a Layer 2 scaling solution for Ethereum, emphasizing private transactions through zk-SNARKs and optimistic rollups. It provides an economical Ethereum privacy wallet, enabling users to transact with ETH, ERC-20s, and NFTs anonymously", - projectStatus: 'archived', - links: { - website: 'https://zkopru.network/', - github: 'https://github.com/zkopru-network', - youtube: 'https://www.youtube.com/watch?v=GvRsJxu9X6w', - }, - extraLinks: { - learn: [{ - label: 'ZKOPRU: Wat, Y & Wen', - url: 'https://mirror.xyz/privacy-scaling-explorations.eth/kfuuBPtGtDjl_J2wBq-jrtyURGLmQpUhZfDTuZChEy8' - }, { - label: "ZKOPRU on Testnet", - url: 'https://mirror.xyz/privacy-scaling-explorations.eth/EB0KcMY0k9ucN8iQSBeOYksoupDYRBQ4ZffhRt477FE' - }], - }, - tags: { - keywords: ['anonymity', 'private transactions'] - } + id: "zkopru", + section: "pse", + image: "zkopru.svg", + name: "ZKOPRU", + tldr: "Optimistic Rollup with zk-SNARKs for private Ethereum transactions.", + description: + "ZKOPRU is one of the initial projects of EF's PSE team. It is a Layer 2 scaling solution for Ethereum, emphasizing private transactions through zk-SNARKs and optimistic rollups. It provides an economical Ethereum privacy wallet, enabling users to transact with ETH, ERC-20s, and NFTs anonymously", + projectStatus: "archived", + links: { + website: "https://zkopru.network/", + github: "https://github.com/zkopru-network", + youtube: "https://www.youtube.com/watch?v=GvRsJxu9X6w", + }, + extraLinks: { + learn: [ + { + label: "ZKOPRU: Wat, Y & Wen", + url: "https://mirror.xyz/privacy-scaling-explorations.eth/kfuuBPtGtDjl_J2wBq-jrtyURGLmQpUhZfDTuZChEy8", + }, + { + label: "ZKOPRU on Testnet", + url: "https://mirror.xyz/privacy-scaling-explorations.eth/EB0KcMY0k9ucN8iQSBeOYksoupDYRBQ4ZffhRt477FE", + }, + ], + }, + tags: { + keywords: ["anonymity", "private transactions"], + }, } diff --git a/data/projects/zkp2p.ts b/data/projects/zkp2p.ts index 12d5a565..537eecc9 100644 --- a/data/projects/zkp2p.ts +++ b/data/projects/zkp2p.ts @@ -6,6 +6,7 @@ ZKP2P is for defi consumers looking to onramp assets on chain quickly without go export const zkp2p: ProjectInterface = { id: "zkp2p", + section: "grant", projectStatus: "active", image: "zkp2p.webp", name: "ZKP2P", diff --git a/lib/types.ts b/lib/types.ts index bd41c46d..94fe8ee4 100644 --- a/lib/types.ts +++ b/lib/types.ts @@ -1,3 +1,7 @@ +// list of project groups +export const ProjectSections = ["pse", "grant", "collaboration"] as const +export type ProjectSection = (typeof ProjectSections)[number] + export interface AnnounceInterface { id: number type?: number @@ -44,6 +48,7 @@ export type ActionLinkType = Partial< export type ProjectStatusType = "active" | "inactive" | "archived" export interface ProjectInterface { id: string + section: ProjectSection image: string imageAlt?: string name: string diff --git a/public/project-banners/p0tion.png b/public/project-banners/p0tion.png new file mode 100644 index 00000000..1b1c7fd9 Binary files /dev/null and b/public/project-banners/p0tion.png differ diff --git a/public/project-banners/powers-of-tau.png b/public/project-banners/powers-of-tau.png new file mode 100644 index 00000000..c4f7ddd3 Binary files /dev/null and b/public/project-banners/powers-of-tau.png differ diff --git a/public/project-banners/pse-security.png b/public/project-banners/pse-security.png new file mode 100644 index 00000000..03d546ee Binary files /dev/null and b/public/project-banners/pse-security.png differ diff --git a/public/project-banners/zkevm.jpg b/public/project-banners/zkevm.jpg new file mode 100644 index 00000000..b0e2c0ed Binary files /dev/null and b/public/project-banners/zkevm.jpg differ diff --git a/public/project-banners/zkml.png b/public/project-banners/zkml.png new file mode 100644 index 00000000..7dbadb8e Binary files /dev/null and b/public/project-banners/zkml.png differ