Merge remote-tracking branch 'upstream/dev' into aggregate-fix-links

Author: brossetti1

app/[locale]/_components/home.tsx

@@ -13,6 +13,7 @@ import type {
 } from "@/lib/types"
 import { CommunityEvent } from "@/lib/interfaces"
 
+import BannerNotification from "@/components/Banners/BannerNotification"
 import { ChevronNext } from "@/components/Chevron"
 import CodeModal from "@/components/CodeModal"
 import HomeHero from "@/components/Hero/HomeHero"
@@ -24,7 +25,6 @@ import Calendar from "@/components/icons/calendar.svg"
 import CalendarAdd from "@/components/icons/calendar-add.svg"
 import { Image } from "@/components/Image"
 import MainArticle from "@/components/MainArticle"
-import { TranslatathonBanner } from "@/components/Translatathon/TranslatathonBanner"
 import {
   Accordion,
   AccordionContent,
@@ -118,7 +118,18 @@ const HomePage = ({
 
   return (
     <MainArticle className="flex w-full flex-col items-center" dir={dir}>
-      <TranslatathonBanner />
+      <BannerNotification shouldShow>
+        <p>
+          Let&apos;s celebrate 10 years of Ethereum! How did ethereum change
+          your life? -{" "}
+          <Link
+            href="https://ethereumstory.paperform.co/"
+            className="text-white"
+          >
+            share your story
+          </Link>
+        </p>
+      </BannerNotification>
       <HomeHero heroImg={Hero} className="w-full" />
       <div className="w-full space-y-32 px-4 md:mx-6 lg:space-y-48">
         <div className="my-20 grid w-full grid-cols-2 gap-x-4 gap-y-8 md:grid-cols-4 md:gap-x-10">
@@ -249,6 +260,11 @@ const HomePage = ({
                   href="/resources/"
                   isSecondary
                   variant="outline"
+                  customEventOptions={{
+                    eventCategory: eventCategory,
+                    eventAction: "ethereum_activity",
+                    eventName: "ethereum_activity",
+                  }}
                 >
                   {t("page-index:page-index-activity-action")} <ChevronNext />
                 </ButtonLink>

app/[locale]/resources/_components/resources.tsx

@@ -13,6 +13,7 @@ import { ResourceItem, ResourcesContainer } from "@/components/Resources"
 import { useResources } from "@/components/Resources/useResources"
 import Translation from "@/components/Translation"
 import { ButtonLink } from "@/components/ui/buttons/Button"
+import { Stack, VStack } from "@/components/ui/flex"
 import Link from "@/components/ui/Link"
 import { Section } from "@/components/ui/section"
 
@@ -23,11 +24,12 @@ import { GITHUB_REPO_URL } from "@/lib/constants"
 import { useActiveHash } from "@/hooks/useActiveHash"
 import { useTranslation } from "@/hooks/useTranslation"
 import heroImg from "@/public/images/heroes/guides-hub-hero.jpg"
-
 interface ResourcesPageProps {
   txCostsMedianUsd: MetricReturnData
 }
 
+const EVENT_CATEGORY = "dashboard"
+
 const ResourcesPage = ({ txCostsMedianUsd }: ResourcesPageProps) => {
   const { t } = useTranslation("page-resources")
   const resourceSections = useResources({ txCostsMedianUsd })
@@ -46,6 +48,11 @@ const ResourcesPage = ({ txCostsMedianUsd }: ResourcesPageProps) => {
             GITHUB_REPO_URL
           ).toString()}
           className="visited:text-white"
+          customEventOptions={{
+            eventCategory: EVENT_CATEGORY,
+            eventAction: "links",
+            eventName: "Ethereum.org Github Page Feedback",
+          }}
         >
           {t("page-resources-share-feedback")}
         </Link>
@@ -57,112 +64,146 @@ const ResourcesPage = ({ txCostsMedianUsd }: ResourcesPageProps) => {
         description={t("page-resources-hero-description")}
         heroImg={heroImg}
       />
-
-      <div className="sticky top-1 my-8 flex flex-col items-center gap-3 py-4 text-center md:top-6 md:px-2">
-        <div className="my-2 text-body-medium">
-          {t("page-resources-whats-on-this-page")}
-        </div>
-        <nav className="z-sticky mx-4 flex max-w-full gap-1 overflow-x-auto bg-background p-2 shadow md:max-w-[calc(100%-2rem)] md:rounded-2xl md:border md:p-0.5 md:shadow-lg">
-          {resourceSections.map(({ key, title, icon }) => (
-            <ButtonLink
-              key={key}
-              href={`#${key}`}
-              variant="ghost"
-              isSecondary
-              className={cn(
-                "relative text-nowrap rounded-xl px-4 py-2 text-sm [&_svg]:shrink-0 [&_svg]:text-sm",
-                activeSection === key && "!text-primary"
-              )}
-            >
-              {activeSection === key && (
-                <motion.div
-                  layoutId="active-section-highlight"
-                  className="absolute inset-0 z-0 rounded-xl bg-primary-low-contrast"
-                />
-              )}
-              {icon && <span className="z-10 text-lg">{icon}</span>}
-              <span className="relative z-10">{title}</span>
-            </ButtonLink>
-          ))}
-        </nav>
-      </div>
-
-      {resourceSections.map(({ key, icon, title: sectionTitle, boxes }) => (
-        <section id={key} key={key} className="mb-16 scroll-mt-40">
-          <div className="group flex w-full items-center gap-3 border-b bg-transparent px-4 py-6">
-            <div className="grid size-12 place-items-center rounded-lg border border-border-low-contrast text-2xl [&_svg]:shrink-0">
-              {icon || <StackIcon />}
-            </div>
-            <h2 className="flex-1 text-start font-black">{sectionTitle}</h2>
+      <Stack className="gap-4 px-2 py-6 md:gap-8 md:px-4 lg:px-8 xl:gap-11">
+        <div className="sticky top-5 flex flex-col items-center gap-3 text-center md:top-6 md:px-2">
+          <div className="my-2 text-body-medium">
+            {t("page-resources-whats-on-this-page")}
           </div>
-          <div className="grid grid-cols-1 gap-8 px-4 pb-12 pt-8 md:pb-12 md:pt-8 lg:grid-cols-2">
-            {boxes.map(({ title, metric, items, className }) => (
-              <div
+          <nav className="z-sticky mx-4 flex max-w-full gap-1 overflow-x-auto bg-background p-2 shadow md:max-w-[calc(100%-2rem)] md:rounded-2xl md:border md:p-0.5 md:shadow-lg">
+            {resourceSections.map(({ key, title, icon }) => (
+              <ButtonLink
+                key={key}
+                href={`#${key}`}
+                variant="ghost"
+                isSecondary
                 className={cn(
-                  "overflow-hidden rounded-2xl border shadow-lg",
-                  className
+                  "relative text-nowrap rounded-xl px-4 py-2 text-sm [&_svg]:shrink-0 [&_svg]:text-sm",
+                  activeSection === key && "!text-primary"
                 )}
-                key={title}
+                customEventOptions={{
+                  eventCategory: EVENT_CATEGORY,
+                  eventAction: "whats_on_this_page",
+                  eventName: key,
+                }}
               >
-                <div className="border-b bg-[#ffffff] px-6 py-4 font-bold dark:bg-[#171717]">
-                  {title}
+                {activeSection === key && (
+                  <motion.div
+                    layoutId="active-section-highlight"
+                    className="absolute inset-0 z-0 rounded-xl bg-primary-low-contrast"
+                  />
+                )}
+                {icon && <span className="z-10 text-lg">{icon}</span>}
+                <span className="relative z-10">{title}</span>
+              </ButtonLink>
+            ))}
+          </nav>
+        </div>
+        <Stack className="gap-11 pt-12 md:gap-16 lg:gap-24">
+          {resourceSections.map(({ key, icon, title: sectionTitle, boxes }) => (
+            <Stack key={key} asChild>
+              <section id={key} className="scroll-mt-40 gap-8 md:gap-6">
+                <div className="group flex w-full items-center gap-4 border-b bg-transparent px-2 py-4">
+                  <div className="grid size-12 place-items-center rounded-lg border border-border-low-contrast text-2xl [&_svg]:shrink-0">
+                    {icon || <StackIcon />}
+                  </div>
+                  <h2 className="flex-1 text-start font-black">
+                    {sectionTitle}
+                  </h2>
                 </div>
-                <div className="h-full bg-background bg-gradient-to-br from-white to-primary/10 px-2 py-6 dark:from-transparent dark:to-primary/10">
-                  {metric && metric}
-                  <ResourcesContainer>
-                    {items.map((item) => (
-                      <ResourceItem item={item} key={item.title} />
-                    ))}
-                  </ResourcesContainer>
+                <div className="grid grid-cols-1 gap-8 lg:grid-cols-2 lg:gap-y-6">
+                  {boxes.map(({ title, metric, items, className }) => (
+                    <div
+                      className={cn(
+                        "overflow-hidden rounded-2xl border shadow-lg",
+                        className
+                      )}
+                      key={title}
+                    >
+                      <div className="border-b bg-[#ffffff] px-6 py-4 font-bold dark:bg-[#171717]">
+                        {title}
+                      </div>
+                      <div className="h-full bg-background bg-gradient-to-br from-white to-primary/10 px-2 py-6 dark:from-transparent dark:to-primary/10">
+                        {metric && metric}
+                        <ResourcesContainer>
+                          {items.map((item) => (
+                            <ResourceItem item={item} key={item.title} />
+                          ))}
+                        </ResourcesContainer>
+                      </div>
+                    </div>
+                  ))}
                 </div>
-              </div>
-            ))}
-          </div>
-        </section>
-      ))}
-
-      <div className="mb-20 text-center">
-        <Translation id="page-resources:page-resources-find-more" />
-      </div>
+              </section>
+            </Stack>
+          ))}
+        </Stack>
 
-      <Section
-        id="contribute"
-        className={cn(
-          "before:absolute before:-inset-px before:bottom-0 before:z-hide before:rounded-[calc(theme(borderRadius.4xl)+1px)] before:content-['']", // Border/gradient positioning
-          "before:bg-gradient-to-b before:from-primary-hover/[0.24] before:to-primary-hover/[0.08] before:dark:from-primary-hover/40 before:dark:to-primary-hover/20", // Border/gradient coloring
-          "relative inset-0 rounded-4xl bg-background" // Paint background color over card portion
-        )}
-      >
-        <div className="mb-12 flex flex-col gap-y-8 rounded-4xl bg-radial-a px-8 py-12 lg:mb-32 xl:mb-36">
-          <div className="flex flex-col gap-y-4 text-center">
-            <h2>{t("page-resources-contribute-title")}</h2>
-            <p>{t("page-resources-contribute-description")}</p>
-          </div>
-          <div className="mx-auto grid grid-cols-1 gap-16 md:grid-cols-2">
-            {/* TODO: Add issue template for resource listing and redirect to new template */}
-            <ButtonLink
-              href={new URL(
-                "issues/new?template=feature_request.yaml",
-                GITHUB_REPO_URL
-              ).toString()}
-              variant="outline"
-              isSecondary
-            >
-              {t("page-resources-suggest-resource")}
-            </ButtonLink>
-            <ButtonLink
-              href={new URL(
-                "issues/new?template=bug_report.yaml",
-                GITHUB_REPO_URL
-              ).toString()}
-              variant="outline"
-              isSecondary
-            >
-              <FaGithub /> {t("page-resources-found-bug")}
-            </ButtonLink>
+        <VStack className="gap-4 py-16">
+          <div className="text-center font-bold">
+            <Translation id="page-resources:page-resources-find-more" />
           </div>
-        </div>
-      </Section>
+          <ButtonLink
+            href="https://ethereumdashboards.com"
+            size="lg"
+            customEventOptions={{
+              eventCategory: EVENT_CATEGORY,
+              eventAction: "links",
+              eventName: "ethereumdashboards.com",
+            }}
+          >
+            ethereumdashboards.com
+          </ButtonLink>
+        </VStack>
+
+        <Section
+          id="contribute"
+          className="relative rounded-4xl border border-body/5 bg-background"
+        >
+          <VStack className="rounded-4xl bg-radial-a px-4 py-6 md:py-12">
+            <Stack className="max-w-xl gap-y-10 py-6 lg:max-w-[700px]">
+              <div className="flex flex-col gap-y-4 text-center">
+                <h2>{t("page-resources-contribute-title")}</h2>
+                <p className="text-lg">
+                  {t("page-resources-contribute-description")}
+                </p>
+              </div>
+              <div className="mx-auto grid grid-cols-1 gap-x-3 gap-y-4 md:grid-cols-2">
+                {/* TODO: Add issue template for resource listing and redirect to new template */}
+                <ButtonLink
+                  href={new URL(
+                    "issues/new?template=feature_request.yaml",
+                    GITHUB_REPO_URL
+                  ).toString()}
+                  variant="outline"
+                  isSecondary
+                  customEventOptions={{
+                    eventCategory: EVENT_CATEGORY,
+                    eventAction: "links",
+                    eventName: "Ethereum.org Github Feature Request",
+                  }}
+                >
+                  {t("page-resources-suggest-resource")}
+                </ButtonLink>
+                <ButtonLink
+                  href={new URL(
+                    "issues/new?template=bug_report.yaml",
+                    GITHUB_REPO_URL
+                  ).toString()}
+                  variant="outline"
+                  isSecondary
+                  customEventOptions={{
+                    eventCategory: EVENT_CATEGORY,
+                    eventAction: "links",
+                    eventName: "Ethereum.org Github Bug Report",
+                  }}
+                >
+                  <FaGithub /> {t("page-resources-found-bug")}
+                </ButtonLink>
+              </div>
+            </Stack>
+          </VStack>
+        </Section>
+      </Stack>
     </MainArticle>
   )
 }

public/content/developers/docs/programming-languages/python/index.md

@@ -19,31 +19,40 @@ Need a more basic primer first? Check out [ethereum.org/learn](/learn/) or [ethe
 - [Understanding Smart Contracts](https://kauri.io/article/e4f66c6079e74a4a9b532148d3158188/ethereum-101-part-5-the-smart-contract)
 - [Write your First Smart Contract](https://kauri.io/article/124b7db1d0cf4f47b414f8b13c9d66e2/remix-ide-your-first-smart-contract)
 - [Learn How to Compile and Deploy Solidity](https://kauri.io/article/973c5f54c4434bb1b0160cff8c695369/understanding-smart-contract-compilation-and-deployment)
+- [The state of Python in blockchain 2023 report](https://tradingstrategy.ai/blog/the-state-of-python-in-blockchain-in-2023)
 
 ## Beginner articles {#beginner-articles}
 
+- [web3.py Overview](https://web3py.readthedocs.io/en/latest/overview.html)
+- [Ethereum Python Ecosystem Tour](https://snakecharmers.ethereum.org/python-ecosystem/)
 - [A (Python) Developer's Guide to Ethereum](https://snakecharmers.ethereum.org/a-developers-guide-to-ethereum-pt-1/)
-- [The state of Python in blockchain 2023 report](https://tradingstrategy.ai/blog/the-state-of-python-in-blockchain-in-2023)
+- [Prize-Worthy: An Ethereum Python Hackathon Guide](https://snakecharmers.ethereum.org/prize-worthy/)
 - [An Introduction to Smart Contracts with Vyper](https://kauri.io/#collections/Getting%20Started/an-introduction-to-smart-contracts-with-vyper/)
-- [Deploy your own ERC20 Token with Python and Brownie](https://betterprogramming.pub/python-blockchain-token-deployment-tutorial-create-an-erc20-77a5fd2e1a58)
 - [How to develop Ethereum contract using Python Flask?](https://medium.com/coinmonks/how-to-develop-ethereum-contract-using-python-flask-9758fe65976e)
 - [Intro to Web3.py · Ethereum For Python Developers](https://www.dappuniversity.com/articles/web3-py-intro)
 - [How to call a Smart Contract function using Python and web3.py](https://stackoverflow.com/questions/57580702/how-to-call-a-smart-contract-function-using-python-and-web3-py)
 
 ## Intermediate articles {#intermediate-articles}
 
+- [Friends of web3.py: Intro to Ape](https://snakecharmers.ethereum.org/intro-to-ape/)
 - [Dapp Development for Python Programmers](https://levelup.gitconnected.com/dapps-development-for-python-developers-f52b32b54f28)
 - [Creating a Python Ethereum Interface: Part 1](https://hackernoon.com/creating-a-python-ethereum-interface-part-1-4d2e47ea0f4d)
 - [Ethereum Smart Contracts in Python: a comprehensive(ish) guide](https://hackernoon.com/ethereum-smart-contracts-in-python-a-comprehensive-ish-guide-771b03990988)
-- [Using Brownie and Python to deploy Smart Contracts](https://dev.to/patrickalphac/using-brownie-for-to-deploy-smart-contracts-1kkp)
-- [Creating NFTs on OpenSea with Brownie](https://www.freecodecamp.org/news/how-to-make-an-nft-and-render-on-opensea-marketplace/)
 
 ## Advanced use patterns {#advanced-use-patterns}
 
+- [web3.py Patterns: Real-Time Event Subscriptions](https://snakecharmers.ethereum.org/subscriptions/)
+- [web3.py Patterns: WebSocketProvider](https://snakecharmers.ethereum.org/websocketprovider/)
 - [Compiling, deploying and calling Ethereum smartcontract using Python](https://yohanes.gultom.id/2018/11/28/compiling-deploying-and-calling-ethereum-smartcontract-using-python/)
 - [Analyze Solidity Smart Contracts with Slither](https://kauri.io/#collections/DevOps/analyze-solidity-smart-contracts-with-slither/#analyze-solidity-smart-contracts-with-slither)
 - [Blockchain Fintech Tutorial: Lending and Borrowing With Python](https://blog.chain.link/blockchain-fintech-defi-tutorial-lending-borrowing-python/)
 
+## Archived articles
+
+- [Deploy your own ERC20 Token with Python and Brownie](https://betterprogramming.pub/python-blockchain-token-deployment-tutorial-create-an-erc20-77a5fd2e1a58)
+- [Using Brownie and Python to deploy Smart Contracts](https://dev.to/patrickalphac/using-brownie-for-to-deploy-smart-contracts-1kkp)
+- [Creating NFTs on OpenSea with Brownie](https://www.freecodecamp.org/news/how-to-make-an-nft-and-render-on-opensea-marketplace/)
+
 ## Python projects and tools {#python-projects-and-tools}
 
 ### Active: {#active}

public/content/developers/tutorials/hello-world-smart-contract-fullstack/index.md

@@ -664,7 +664,7 @@ Successfully verified contract HelloWorld on Etherscan.
 https://goerli.etherscan.io/address/<contract-address>#contracts
 ```
 
-Congrats! Your smart contract code is on Etherescan!
+Congrats! Your smart contract code is on Etherscan!
 
 ### Check out your smart contract on Etherscan! {#check-out-your-smart-contract-on-etherscan}
 

public/content/translations/es/developers/tutorials/hello-world-smart-contract-fullstack/index.md

@@ -661,7 +661,7 @@ Successfully verified contract HelloWorld on Etherscan.
 https://goerli.etherscan.io/address/<contract-address>#contracts
 ```
 
-¡Felicidades! ¡Su código de contrato inteligente está en Etherescan!
+¡Felicidades! ¡Su código de contrato inteligente está en Etherscan!
 
 ### ¡Eche un vistazo a su contrato inteligente en Etherscan! {#check-out-your-smart-contract-on-etherscan}