Merge pull request #191 from privacy-scaling-explorations/update-read…

…me-cleanup

update project README & clean-ups

app/[lang]/projects/page.tsx

@@ -1,12 +1,12 @@
 import { Metadata } from "next"
 import Image from "next/image"
 
+import { Divider } from "@/components/divider"
 import { PageHeader } from "@/components/page-header"
 import ProjectFiltersBar from "@/components/project/project-filters-bar"
 import { ProjectList } from "@/components/project/project-list"
 import { ProjectResultBar } from "@/components/project/project-result-bar"
 import { useTranslation } from "@/app/i18n"
-import { Divider } from "@/components/divider"
 
 export const metadata: Metadata = {
   title: "Project Library",
@@ -38,7 +38,7 @@ export default async function ProjectsPage({ params: { lang } }: any) {
       </PageHeader>
 
       <div className="w-full bg-white pb-28">
-        <div className="container flex flex-col gap-14 py-8">
+        <div className="container flex flex-col py-8 gap-14">
           <div>
             <ProjectResultBar lang={lang} />
           </div>

components/project/project-card.tsx

@@ -7,6 +7,7 @@ import { VariantProps, cva } from "class-variance-authority"
 
 import { ProjectInterface, ProjectLinkWebsite } from "@/lib/types"
 import { cn } from "@/lib/utils"
+import useContent from "@/hooks/useContent"
 import { useTranslation } from "@/app/i18n/client"
 import { LocaleTypes } from "@/app/i18n/settings"
 
@@ -54,10 +55,13 @@ export default function ProjectCard({
 }: ProjectCardProps & { lang: LocaleTypes }) {
   const { t } = useTranslation(lang, "common")
 
-  const { id, image, links, name, tldr, tags, imageAlt, projectStatus } =
-    project
+  const { id, image, links, name, tags, imageAlt, projectStatus } = project
 
   const projectNotActive = projectStatus !== "active"
+  const { projectContent } = useContent({
+    lang,
+    id,
+  })
 
   return (
     <Link
@@ -74,15 +78,15 @@ export default function ProjectCard({
             className="min-h-[160px] w-full overflow-hidden rounded-t-lg border-none object-cover"
           />
           {!image && (
-            <span className="absolute left-1/2 top-1/2 w-full -translate-x-1/2 -translate-y-1/2 px-5 text-center text-xl font-bold text-black">
+            <span className="absolute w-full px-5 text-xl font-bold text-center text-black -translate-x-1/2 -translate-y-1/2 left-1/2 top-1/2">
               {imageAlt || name}
             </span>
           )}
         </div>
       )}
-      <div className="flex h-full flex-col justify-between rounded-b-lg bg-white p-4">
+      <div className="flex flex-col justify-between h-full p-4 bg-white rounded-b-lg">
         <div className="flex flex-col justify-start gap-2">
-          <div className="mb-2 flex gap-2">
+          <div className="flex gap-2 mb-2">
             {tags?.themes?.map((theme, index) => {
               const { label } = ThemesButtonMapping(lang)?.[theme]
               const icon = TagsIconMapping?.[theme]
@@ -98,11 +102,11 @@ export default function ProjectCard({
             })}
           </div>
           <h1 className="text-xl font-bold text-black">{name}</h1>
-          <div className="flex h-28 flex-col gap-4">
-            <p className="text-slate-900/80">{tldr}</p>
+          <div className="flex flex-col gap-4 h-28">
+            <p className="text-slate-900/80">{projectContent?.tldr}</p>
           </div>
         </div>
-        <div className="mt-auto flex justify-between">
+        <div className="flex justify-between mt-auto">
           {showLinks && (
             <div className="flex items-center justify-start gap-3">
               {Object.entries(links ?? {})?.map(([website, url], index) => {

data/projects.ts

@@ -1,7 +1,6 @@
 import GithubIcon from "@/public/social-medias/github-fill.svg"
 import GlobeIcon from "@/public/social-medias/global-line.svg"
 import TwitterIcon from "@/public/social-medias/twitter-fill.svg"
-import i18next, { InitOptions } from "i18next"
 
 import { ProjectInterface, ProjectLinkType } from "@/lib/types"
 
@@ -21,11 +20,11 @@ import { jubmoji } from "./projects/jubmoji"
 import { maci } from "./projects/maci"
 import { maciRPGF } from "./projects/maci-rpgf"
 import { nfctap } from "./projects/nfctap"
+import { OpenPassport } from "./projects/openpassport"
 import { p0tion } from "./projects/p0tion"
 import { p256 } from "./projects/p256"
 import { pollenLabs } from "./projects/pollen-labs"
 import { PerpetualPowersOfTau } from "./projects/powers-of-tau"
-import { OpenPassport } from "./projects/openpassport"
 import { pseSecurity } from "./projects/pse-security"
 import { rln } from "./projects/rln"
 import { semaphore } from "./projects/semaphore"
@@ -50,24 +49,6 @@ export const ProjectLinkIconMap: ProjectLinkType = {
   twitter: TwitterIcon,
 }
 
-export const defineProjectTranslations = (
-  resources: InitOptions["resources"] = {}
-) => {
-  const languageCode = location?.pathname.split("/")[1]
-  console.log("languageCode", languageCode)
-  return null
-  i18next.init({
-    lng: languageCode, // if you're using a language detector, do not define the lng option
-    debug: true,
-    resources: {
-      en: {
-        translation: {
-          tldr: "hello world",
-        },
-      },
-    },
-  })
-}
 /**
  * List of Projects
  *

data/projects/README.md

@@ -1,5 +1,8 @@
 ## Add new project to projects list
 
+
+
+
 ####  1. Create a New Project File:
   - Navigate to the [...]/data/projects folder within your project directory.
  - Inside this folder, create a new file named [project_name].ts.
@@ -8,6 +11,8 @@
  - Open the newly created [project_name].ts file.
  - To ensure all necessary parameters are included, use the ProjectInterface template. Here's a basic structure to get you started:
 
+**Note**: The `description` and `tldr` are now managed through the respective translation file located in /i18n/locales. Refer to step #4 for more details.
+
 ```js
 export const project_name: ProjectInterface = {
   id: "project_name",
@@ -37,6 +42,20 @@ const projects: ProjectInterface[] = [
 ];
 ```
 
+#### 4. Project Description and TLRD
+With the project now supporting multiple languages, the description and content fields are managed in the internalization folder. Follow these steps:
+- Create a new project_id.json file in /app/i18n/locales/${lang}/projects/${project_id}.json.
+- Ensure the project_id defined in Step 2 matches the project_id.json file.
+- In this new file, add the description and tldr for the project.
+- Repeat these steps for each language you wish to support.
+
+```json
+{
+  "description": "project description content",
+  "tldr": "project tldr"
+}
+```
+
 By following these steps, you will successfully add a new project and ensure it is correctly registered and visible.
 
 ## Show badges in the project card
@@ -68,8 +87,6 @@ export const example: ProjectInterface = {
   id: "example",
   image: "",
   name: "This is an example of the project",
-  tldr: 'The project one-liner',
-  description: 'A longer project description',
   projectStatus: '',
   tags: {
     themes: ["play", "buildWith"],

data/projects/anon-aadhaar.ts

@@ -1,17 +1,11 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-Anon Aadhaar is a project that allows individuals to prove their citizenship anonymously. The project provides circuits, an SDK, and demo applications that generate and verify proofs of valid Aadhaar cards, integrating with the PCD framework to support a wide range of applications.
-`
-
 export const anonAadhaar: ProjectInterface = {
   id: "anon-aadhaar",
   section: "pse",
   projectStatus: "active",
   image: "anon-aadhaar.svg",
   name: "Anon Aadhaar",
-  tldr: "Tools for building build privacy-preserving applications using government ID cards, specifically Aadhaar cards in India.",
-  description,
   links: {
     website: "https://anon-aadhaar.pse.dev/",
     github: "https://github.com/privacy-scaling-explorations/anon-aadhaar",

data/projects/anon-klub.ts

@@ -1,17 +1,11 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-AnonKlub is a tool designed for Ethereum developers that allows for anonymous proof of Ethereum address ownership. It doesn't directly address the public observability of Ethereum transactions but provides a workaround for privacy. Users can prepare a list of Ethereum addresses, sign a message from an address they own, and use that signature to generate a zero-knowledge proof. This proof enables users to perform actions anonymously that would typically require ownership of an address from the initial list. Use cases include anonymous NFT minting and Discord verification for DAOs without disclosing the public address.
-`
-
 export const anonKlub: ProjectInterface = {
   id: "anon-klub",
   section: "pse",
   projectStatus: "inactive",
   image: "anonklub.svg",
   name: "AnonKlub",
-  tldr: "A mechanism for anonymous proof of Ethereum address ownership.",
-  description,
   links: {
     github: "https://github.com/anonklub",
     website: "https://anonklub.github.io",

data/projects/bandada.ts

@@ -1,17 +1,11 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-Bandada is a project designed to simplify the management of privacy-preserving Semaphore groups. It is aimed at developers who want to build privacy-based applications and integrate anonymity sets, as well as non-developers working in DAOs, governments, international institutions, non-profit organizations, and associations that want to create and manage anonymous groups. Bandada offers a plug-and-play infrastructure, reducing the time and complexity required for managing anonymity sets. It enables anonymous signaling, such as voting, messaging, login, or endorsing, in various use cases like private organizations, GitHub repository contributors, and groups of wallets holding a specific NFT.
-`
-
 export const bandada: ProjectInterface = {
   id: "bandada",
   section: "pse",
   projectStatus: "active",
   image: "bandada.webp",
   name: "Bandada",
-  tldr: "An open-source system for managing privacy-preserving groups of anonymous individuals.",
-  description,
   links: {
     github: "https://github.com/privacy-scaling-explorations/bandada",
     website: "https://bandada.pse.dev",

data/projects/channel-4.ts

@@ -1,17 +1,11 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-Channel 4 is a community-driven platform where users can submit and discover content. It uses state channels to incentivize user engagement. When a user likes the content you've submitted, a state channel closes and rewards are dropped into their wallet. This approach combines entertainment with the power of state channels, enabling community members to earn while they engage.
-`
-
 export const channel4: ProjectInterface = {
   id: "channel-4",
   section: "pse",
   projectStatus: "inactive",
   image: "channel4.svg",
   name: "Channel 4",
-  tldr: "Content discovery through community contributions, using state channels to reward users for popular posts.",
-  description,
   links: {
     github: "https://github.com/State-Channel-4",
     website: "https://channel4.wtf/",

data/projects/chiquito.ts

@@ -1,26 +1,26 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-Chiquito is a high-level structured language for implementing zero knowledge proof circuits, currently being implemented in the DSL Working Group of PSE. It is a state machine zk-language that provides better syntax and abstraction. It can automatically compiler arbitrary boolean expressions for state machine transitions. It can optimise the resulting arithmetization. Chiquito has a Halo2 backend, which is a low level zkDSL that writes circuits using the PLONKish arithmetization and is working on supporting additional backends. Chiquito circuits can be written using both Python and Rust. 
-`
-
 export const chiquito: ProjectInterface = {
-    id: "chiquito",
-    section: "pse",
-    projectStatus: "active",
-    image: "",
-    name: "chiquito",
-    tldr: "A modern ZKP language and compiler for plonkish and AIR arithmetizations",
-    description,
-    links: {
-        github: "https://github.com/privacy-scaling-explorations/chiquito",
-        website: "https://docs.pecadorplonkish.xyz/",
-        twitter: "",
-    },
-    tags: {
-        themes: ["build"],
-        types: ["Legos/dev tools", "Lego sets/toolkits", "Proof of concept", "language", "dsl"],
-        keywords: ["DSL", "language", "rust", "python", "halo2"],
-        builtWith: ["halo2", "rust"],
-    },
-}
+  id: "chiquito",
+  section: "pse",
+  projectStatus: "active",
+  image: "",
+  name: "chiquito",
+  links: {
+    github: "https://github.com/privacy-scaling-explorations/chiquito",
+    website: "https://docs.pecadorplonkish.xyz/",
+    twitter: "",
+  },
+  tags: {
+    themes: ["build"],
+    types: [
+      "Legos/dev tools",
+      "Lego sets/toolkits",
+      "Proof of concept",
+      "language",
+      "dsl",
+    ],
+    keywords: ["DSL", "language", "rust", "python", "halo2"],
+    builtWith: ["halo2", "rust"],
+  },
+}

data/projects/coco.ts

@@ -5,9 +5,6 @@ export const Coco: ProjectInterface = {
   section: "pse",
   image: "coco.svg",
   name: "COCO",
-  tldr: "Integrating Nova into the EVM involves wrapping Liam Eagen's theoretical ECIP argument in Halo 2",
-  description:
-    "With Coco, groups can collaborate to curate feeds of any topic they're interested in. As you scroll through your Coco feed, rather than upvoting or downvoting posts, you'll spend WETH to predict what other group members and the group's moderators will want to see. When you're right, you'll get back your original WETH and more — but if you're wrong, you'll lose what you put in. Through this process, you help Coco filter value from noise to make sure group feeds only consist of posts that the group cares about.",
   projectStatus: "inactive",
   tags: {
     keywords: ["prediction market", "scaling"],

data/projects/cryptkeeper.ts

@@ -1,17 +1,11 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-CryptKeeper is a browser extension that generates Semaphore and RLN proofs for websites, providing a secure and portable solution for managing anonymous identity secrets across different applications. It simplifies the integration of zero-knowledge (ZK) identities and proofs into applications, allowing developers to focus on building the front-end and logic of their applications. By handling complex aspects of cryptography, circuits, caching, and storage, CryptKeeper enables users to interact with decentralized applications (dapps) without revealing their private identity secrets. It is aimed at building secure community standards for the growing ZK ecosystem.
-`
-
 export const cryptkeeper: ProjectInterface = {
   id: "cryptkeeper",
   section: "pse",
   projectStatus: "inactive",
   image: "cryptkeeper.webp",
   name: "CryptKeeper",
-  tldr: "A browser extension for secure, portable anonymous identity management across applications.",
-  description,
   links: {
     github: "https://github.com/CryptKeeperZK",
   },

data/projects/discreetly.ts

@@ -1,17 +1,11 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-An anonymous, federated, chat application that uses Rate-Limiting Nullifier for spam prevention.
-`
-
 export const discreetly: ProjectInterface = {
   id: "discreetly",
   section: "pse",
   projectStatus: "active",
   image: "discreetly.svg",
   name: "Discreetly",
-  tldr: "An anonymous, federated, chat application using ZK.",
-  description,
   links: {
     github: "https://github.com/Discreetly",
     website: "https://app.discreetly.chat/",

data/projects/dsl-working-group.ts

@@ -1,18 +1,12 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-The DSL Working Group is focused on the exploration and improvement of languages used to write zero-knowledge circuits. The group's primary goal is to enhance the state of zk circuit languages, making them easier to write and review by offering the right abstractions. They also aim to make it harder to write unsound circuits by implementing static analysis and enforcing safer patterns. Additionally, they are working to support next-generation (Incrementally Verifiable Computation or IVC) proving systems. The group is currently working on Chiquito, a high-level Domain-Specific Language (DSL) for Halo2 circuits that lowers the entry barrier to write zk circuits with a state-machine abstraction API.
-`
-
 export const dslWorkingGroup: ProjectInterface = {
   id: "dsl-working-group",
   section: "pse",
   projectStatus: "active",
   image: "",
   imageAlt: "DSL Working Group",
   name: "DSL Working Group",
-  tldr: "Exploration of languages for writing zk circuits",
-  description,
   links: {
     github: "https://github.com/privacy-scaling-explorations/chiquito/",
   },

data/projects/ecip-halo2.ts

@@ -6,8 +6,6 @@ export const ECIPHalo2: ProjectInterface = {
   image: "",
   imageAlt: "ECIP + Halo 2",
   name: "ECIP (Elliptic Curve Inner Products) Halo 2 Implementation",
-  tldr: "Integrating Nova into the EVM involves wrapping Liam Eagen's theoretical ECIP argument in Halo 2",
-  description: `Liam Eagen has developed a ZK proof for Elliptic Curve Inner Products (ECIPs) to overcome a significant bottle neck in recursive proof composition over elliptic curve cycles. The p1rocess of integrating Nova into the EVM requires an efficient method or "argument" for handling large elliptic Multi-Scalar Multiplications (MSMs). The final step in this integration process involves wrapping this argument Halo 2.`,
   projectStatus: "active",
   links: {
     github: "https://github.com/levs57/sage-circuits/",

data/projects/eigen-trust.ts

@@ -1,17 +1,11 @@
 import { ProjectInterface } from "@/lib/types"
 
-const description = `
-EigenTrust is a library designed to manage trust within a distributed network, incorporating zero-knowledge features. It serves as a reputation bank for the Ethereum ecosystem, providing an interoperable layer for managing reputation and trust. The protocol creates zero-knowledge proofs of reputation scores based on ratings given by network participants. This allows for the creation of a reputation system for peer-to-peer marketplaces and exchanges, reputation-weighted voting, and community gatekeeping.
-`
-
 export const eigenTrust: ProjectInterface = {
   id: "eigen-trust",
   section: "pse",
   projectStatus: "inactive",
   image: "",
   name: "EigenTrust",
-  tldr: "A distributed reputation system with zero-knowledge features.",
-  description,
   links: {
     github: "https://github.com/eigen-trust/protocol",
   },

data/projects/interep.ts

@@ -5,9 +5,6 @@ export const Interep: ProjectInterface = {
   section: "pse",
   image: "interep.svg",
   name: "Interep",
-  tldr: "An identity bridge from web2 to web3",
-  description:
-    "Interep aims to provide an identity solution for Ethereum users by bridging from an established digital identity source such as Reddit, Twitter, and Github. The product provides an identity layer in the application stack and uses the Semaphore framework to ensure privacy. Interep allows users to establish sybil-resistant decentralized identities on web3 without starting from scratch. By leveraging zero-knowledge proofs, Interep ensures only essential information is disclosed.",
   projectStatus: "inactive",
   tags: {
     keywords: ["social", "reputation"],