add event: Added Writers first competition (Redo)

src/app/content/[slug]/page.tsx

@@ -16,12 +16,7 @@ import BackSvg from "@/assets/svgs/common/back.svg";
 
 import { SvgIcon, Skeleton } from "@mui/material";
 
-const MDXRemote = dynamic(
-  () => import("next-mdx-remote").then((mod) => mod.MDXRemote),
-  {
-    ssr: false,
-  },
-);
+import { MDXRemote } from "next-mdx-remote";
 
 export default function ContentDetailsPage() {
   const [data, setData] = useState<any>([]);

src/app/events/List/EventsCard.tsx

@@ -104,7 +104,7 @@ const EventsCard = ({ content }) => {
           onClick={() =>
             sendGAEvent("event", "hackathonClicked", { value: content.name })
           }
-          disabled={content.buttonDisabled}
+          disabled={content.buttonDisabled == true}
         >
           {content.buttonText}
         </Button>

src/app/events/[slug]/page.tsx

@@ -13,12 +13,7 @@ import { Box } from "@mui/material";
 import useCheckViewport from "@/hooks/useCheckViewport";
 import Data from "../eventsList.json";
 
-const MDXRemote = dynamic(
-  () => import("next-mdx-remote").then((mod) => mod.MDXRemote),
-  {
-    ssr: false,
-  },
-);
+import { MDXRemote } from 'next-mdx-remote';
 
 const EventsDetailsPage = () => {
   const [eventsData, setEventsData] = useState<any>([]);
@@ -54,6 +49,7 @@ const EventsDetailsPage = () => {
     <div className="mt-[-6.5rem] flex flex-col pb-2.5">
       <EventsHeader
         title={eventsData.name}
+        buttonText={eventsData.buttonText}
         registrationLink={`../../events/${slug}/register`}
         url={`/images/events/${slug}.svg`}
         eventsDate={eventsData.date}
@@ -77,7 +73,7 @@ const EventsDetailsPage = () => {
                       })
                     }
                   >
-                    Register now
+                    {eventsData.buttonText}
                   </Button>
                 </div>
               )}
@@ -87,20 +83,6 @@ const EventsDetailsPage = () => {
             )}
           </React.Fragment>
         ))}
-        <div className="mt-10">
-          <Button
-            color="primary"
-            href={`../../events/${slug}/submit`}
-            width={isMobile ? "100%" : "25rem"}
-            onClick={() =>
-              sendGAEvent("event", "hackathonClicked", {
-                value: { slug },
-              })
-            }
-          >
-            Submit your project
-          </Button>
-        </div>
       </div>
     </div>
   );

src/app/events/eventsList.json

@@ -1,4 +1,17 @@
 [
+  {
+    "name": "Ethereum, ZK and Scroll writers competition",
+    "date": "Oct 28 - Sept 13, 2024",
+    "location": "Global Online Event",
+    "url": "../events/writers-competition-2024q4",
+    "image": "/images/writers-competition-2024q4.svg",
+    "buttonText": "Submit your article",
+    "buttonDisabled": "false",
+    "status": ["All time", "Live"],
+    "region": ["All regions", "Virtual"],
+    "registrationLink": "https://tally.so/r/mYYVo0",
+    "submissionLink": "https://tally.so/r/3NYdWQ"
+  },
   {
     "name": "Ethcon Korea 2024 ",
     "date": "Oct 18-20, 2024",

src/app/solidity/[slug]/page.tsx

@@ -17,12 +17,7 @@ import { SvgIcon, Box, Typography, Skeleton } from "@mui/material";
 
 import { styled } from "@mui/system";
 
-const MDXRemote = dynamic(
-  () => import("next-mdx-remote").then((mod) => mod.MDXRemote),
-  {
-    ssr: false,
-  },
-);
+import { MDXRemote } from "next-mdx-remote";
 
 const ChallengeInfo = styled(Box)({
   display: "grid",

src/components/EventsHeader/index.tsx

@@ -13,7 +13,7 @@ import BackSvg from "@/assets/svgs/common/back.svg";
 
 const EventsHeader = (props) => {
   const { isMobile } = useCheckViewport();
-  const { title, url, registrationLink, eventsDate, location, imgClass } =
+  const { title, buttonText, url, registrationLink, eventsDate, location, imgClass } =
     useMemo(() => props, [props]);
 
   console.log("Props: ", props);
@@ -62,7 +62,7 @@ const EventsHeader = (props) => {
                 })
               }
             >
-              Register now
+              { buttonText }
             </Button>
           </div>
           <img

src/events/writers-competition-2024q4/overview.mdx

@@ -0,0 +1,93 @@
+---
+title: "Scroll Articles Bounty Contest: Write and Earn!"
+dates: "Oct 28 - Sept 13, 2024"
+submission_form: https://latexeditor.lagrida.com/#google_vignette
+published: true
+index: 1
+---
+
+### Who is this contest for?
+
+Web3 developers of all levels—beginner, intermediate, and advanced—who are passionate about learning and sharing their knowledge about the latest on Ethereum. The focus areas include applied ZK, scalability, and new technologies improving how we transact and interact on the Ethereum.
+
+### Contest Rules
+
+1. **Pick a topic** from the Article Topic Board down below. Each topic includes detailed expectations and a corresponding bounty for the article.
+2. **Choose up to three topics** from the board. Every participant can submit up to three articles of their choice, only one winner will be selected per topic.
+3. **Optional**: Share what you're working on via our [Telegram group](https://t.me/+0tvdw8QMJBMyOTli).
+4. **Submit your article** by the XX deadline (UTC). It must be published on a public blog (e.g., Mirror, Hashnode, Hackmd, dev.to, Devpost, Paragraph, Medium, etc.) under an open-source license such as MIT, GPL, or CC BY.
+5. **Winners** will be contacted via Telegram (ensure your contact information is up to date).
+6. **Stick to testnets (or devnets):** Since the tutorials are for developers, please use testnets to ensure no real money is required.
+7. **Submissions** must be in English and must follow this format:
+
+```markdown
+**Intro:**
+  - One or two paragraphs providing context about the technology
+  - What it is and why it's important
+  - Optionally: some history, current users, or relevant statistics
+  - Link to the GitHub repository with full code, if applicable
+
+# Setting Up the Development Environment
+
+How to install necessary dependencies, tools, and libraries
+
+# 1. Step-by-Step Development Guide
+
+...
+
+# 2. Detailed Steps
+
+...
+
+# 3. One Task at a Time
+
+...
+
+# Conclusion: What’s Next?
+
+Wrap up with conclusions and encourage the reader to continue experimenting. You can include:
+- Links to official documentation
+- More advanced examples
+- Your personal opinion on the technology
+- Your vision for the future of the technology
+```
+
+## Article Topic Board
+
+### Ethereum Tech
+- **Getting started with [Ethereum Blobs](https://eips.ethereum.org/EIPS/eip-4844) (500$)**
+  - Introduction to Ethereum blobs, a tecnology introduced for Ethereum for L2 scaling.
+- **AA (400$)**
+  - Account Abstraction tutorial, how implement a protocol such as [EIP 4337](https://eips.ethereum.org/EIPS/eip-4337).
+- **Index Data and Analytics (300$)**
+  - Making [Ethereum Legible](https://vitalik.eth.limo/general/2024/09/28/alignment.html) is very imporant. Explain how to query and present data by using a tool such as [Dune](https://dune.com/), [Scrollscan API](https://docs.scrollscan.com/), or by querying [your own Node](https://docs.scroll.io/en/developers/guides/running-a-scroll-node/).
+- **Restaking (300$)**
+  - Explanation and tutorial about restaking, a mechanism to earn yield while helping securing Ethereum.
+
+### Programmable Cryptography
+- **[TLS Notary](https://tlsnotary.org/) (500$)**
+  - Use of the TLS Notary protocol for creating cryptographic proofs of HTTPS connection authenticity.
+- **[ZK-Email](https://prove.email/) and [ZK-Regex](https://github.com/zkemail/zk-regex) (500$)**
+  - Application of zero-knowledge proofs for email and regular expressions, focusing on privacy protection.
+- **Getting started with [MACI](https://maci.pse.dev/) (500$)**
+  - Introduction to MACI (Minimal Anti-Collusion Infrastructure), a cryptographic tool designed for anonymous voting.
+- **Getting started with [Semaphore](https://semaphore.pse.dev/) (500$)**
+  - Explanation of Semaphore, a protocol for ensuring anonymity and privacy on Ethereum.
+
+### Scroll Tech
+- **[Scroll SDK](https://docs.scroll.io/en/sdk/) (600$)**
+  - Showcase how to create a [Scroll SDK chart](https://github.com/scroll-tech/scroll-sdk/tree/develop/charts) or cover something that hasn't been explained by the [official docs](https://docs.scroll.io/en/sdk/).
+- **L1/L2 Interoperability (500$)**
+  - Scroll is closely integrated with Ethereum, in this topic you can explore [Storage Proofs](https://docs.scroll.io/en/technology/sequencer/zktrie/), asset [bridge](https://docs.scroll.io/en/developers/l1-and-l2-bridging/) and transaction bridging.
+- **[L1SLOAD](https://scroll.io/blog/towards-the-wallet-endgame-with-keystore) (500$)**
+  - Advanced data loading in Ethereum Layer 1, optimizing storage access. Take a look at this [guide](https://www.levelup.xyz/content/l1sload-guide-read-the-l1-state-from-l2).
+
+## Support, Feedback, and Questions
+
+Join the [Scroll LevelUp Telegram group](https://t.me/+0tvdw8QMJBMyOTli) for assistance.
+
+### Judging Criteria
+
+1. **Creativity:** Add your personal touch by incorporating images, GIFs, videos, code challenges or anything that makes your article easier to understand for developers. Feel free to grab inspiration from our [content](/content) and [challenges](/challenges).
+2. **Content Quality:** Clear, in depth and accurate articles will score higher.
+3. **Follow the Format:** Follow the provided structure and make sure that the article is easy to follow.