[Portal] Feature: Modified overview and added components (#5547)

## Problem solved

Short description of the bug fixed or feature added. PROT-926

<!-- start pr-codex -->

---

## PR-Codex overview
This PR focuses on enhancing documentation for various smart contracts by adding new components and updating existing content. It introduces new `ContractDeployCard` elements to highlight modular contract options and expands the description of certain contracts.

### Detailed summary
- Updated `VALID_ISSUE_PREFIXES` in `.github/workflows/issue.yml` to include `PROT`.
- Added `ContractDeployCard` components in multiple `.mdx` files for:
  - `Modular Token`
  - `Modular Edition Drop`
  - `Modular Open Edition`
  - `Modular Token Drop`
  - `Modular NFT Collection`
  - `Modular NFT Drop`
  - `Modular Edition`
- Revised introduction and features sections in `apps/portal/src/app/contracts/page.mdx`.

> ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}`

<!-- end pr-codex -->

Author: saminacodes

.github/workflows/issue.yml

@@ -5,7 +5,7 @@ on:
     types: [opened, edited]
 
 env:
-  VALID_ISSUE_PREFIXES: "CNCT|DASH"
+  VALID_ISSUE_PREFIXES: "CNCT|DASH|PROT"
 
 jobs:
   linear:

apps/portal/src/app/contracts/explore/pre-built-modular/edition-drop/page.mdx

@@ -1,4 +1,5 @@
-import { createMetadata, DocImage, Steps, Step, Callout, ContractDeployCard } from "@doc";
+import { createMetadata, DocImage, Steps, Step, Callout } from "@doc";
+import { ContractDeployCard } from "@/components/Document/ContractDeployCard";
 import editionDropStep1 from './assets/edition_drop_step1.png'
 import editionDropStep2 from './assets/edition_drop_step2.png'
 import editionDropStep3 from './assets/edition_drop_step3.png'
@@ -10,6 +11,9 @@ The Edition Drop contract also known as “semi-fungible” or “multi” token
 
 Edition Drop includes settings called claim conditions which allow deployers to set a prices for tokens per claim phase and limits on how many tokens to be released. 
 
+<ContractDeployCard contractName="Modular Edition Drop" href="https://thirdweb.com/thirdweb.eth/ERC1155CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzExNTUifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlNlcXVlbnRpYWxUb2tlbklkRVJDMTE1NSJ9&displayName=Modular+Edition+Drop" />
+
+
 ### Edition Drop vs Edition
 
 The Edition Drop contract allows users to claim tokens based on specific settings set using Claim Conditions. If you do not need to set limits or special settings on how to claim, refer to the Edition contract.

apps/portal/src/app/contracts/explore/pre-built-modular/edition/page.mdx

@@ -1,4 +1,5 @@
-import { createMetadata, DocImage, Steps, Step, Callout, ContractDeployCard } from "@doc";
+import { createMetadata, DocImage, Steps, Step, Callout} from "@doc";
+import { ContractDeployCard } from "@/components/Document/ContractDeployCard";
 import editionStep1 from './assets/edition_step1.png'
 import editionStep2 from './assets/edition_step2.png'
 import editionStep3 from './assets/edition_step3.png'
@@ -11,6 +12,8 @@ The Edition contract also known as “semi-fungible” or “multi” tokens cre
 
 For advanced use cases, Edition enables signature-minting capabilities.
 
+<ContractDeployCard contractName="Modular Edition" href="https://thirdweb.com/thirdweb.eth/ERC1155CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMTE1NSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzExNTUifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlNlcXVlbnRpYWxUb2tlbklkRVJDMTE1NSJ9&displayName=Modular+Edition" />
+
 ### Edition vs Edition Drop
 
 Edition does not have lazy minting capabilities or claim conditions. If you’d prefer to define specific settings such as claim limits, start and end times to claim, and more, please refer to the [Edition Drop contract](https://thirdweb.com/thirdweb.eth/ERC1155CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzExNTUifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlNlcXVlbnRpYWxUb2tlbklkRVJDMTE1NSJ9&displayName=Modular+Edition+Drop). 

apps/portal/src/app/contracts/explore/pre-built-modular/nft-collection/page.mdx

@@ -1,4 +1,5 @@
-import { createMetadata, DocImage, Steps, Step, Callout, ContractDeployCard } from "@doc";
+import { createMetadata, DocImage, Steps, Step, Callout } from "@doc";
+import { ContractDeployCard } from "@/components/Document/ContractDeployCard";
 import collectionStep1 from './assets/nft_collection_step1.png'
 import collectionStep2 from './assets/nft_collection_step2.png'
 import collectionStep3 from './assets/nft_collection_step3.png'
@@ -12,6 +13,8 @@ The NFT Collection contract creates a unique collection of NFTs based on the ERC
 
 For advanced use-cases requiring , NFT Collection includes signature-based minting capabilities. 
 
+<ContractDeployCard contractName="Modular NFT Collection" href="https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDNzIxIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzcyMSJ9&displayName=Modular+NFT+Collection" />
+
 ### NFT Collection vs NFT Drop
 
 NFT Collection contract does not have lazy minting capabilities or claim conditions. If you’d prefer to define specific settings such as claim limits, start and end times to claim, and more, please refer to the [NFT Drop contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+NFT+Drop). 

apps/portal/src/app/contracts/explore/pre-built-modular/nft-drop/page.mdx

@@ -1,4 +1,6 @@
-import { createMetadata, DocImage, Steps, Step, Callout, ContractDeployCard } from "@doc";
+import { createMetadata, DocImage, Steps, Step, Callout } from "@doc";
+import { ContractDeployCard } from "@/components/Document/ContractDeployCard";
+
 import nftDropStep1 from './assets/nft_drop_step1.png'
 import nftDropStep2 from './assets/nft_drop_step2.png'
 import nftDropStep3 from './assets/nft_drop_step3.png'
@@ -7,6 +9,8 @@ import nftDropStep3 from './assets/nft_drop_step3.png'
 
 The NFT Drop contract creates a unique collection of NFTs based on the [ERC-721A](https://www.erc721a.org/) standard. NFT Drop allows you to define claim conditions or settings which define how a user can claim an NFT.
 
+<ContractDeployCard contractName="Modular NFT Drop" href="https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+NFT+Drop" />
+
 ### NFT Drop vs NFT Collection
 
 NFT Drop has the Claimable module enabling claim conditions. If you’d prefer to not define specific settings such as claim limits, start and end times to claim, and more, please refer to the [NFT Collection contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDNzIxIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzcyMSJ9&displayName=Modular+NFT+Collection). 

apps/portal/src/app/contracts/explore/pre-built-modular/open-edition/page.mdx

@@ -1,4 +1,5 @@
-import { createMetadata, DocImage, Steps, Step, Callout, ContractDeployCard } from "@doc";
+import { createMetadata, DocImage, Steps, Step, Callout } from "@doc";
+import { ContractDeployCard } from "@/components/Document/ContractDeployCard";
 import openEditionStep1 from './assets/oe_step1.png'
 import openEditionStep2 from './assets/oe_step2.png'
 import openEditionStep3 from './assets/oe_step3.png'
@@ -11,6 +12,8 @@ import openEditionStep4 from './assets/oe_step4.png'
 
 The Open Edition contract creates NFTs with shared metadata with unique token IDs appended to the NFTs name. Contrary to standard NFT contracts, Open Edition has an unlimited supply and users may continuously mint them increasing accessibility to a broader audience. The Open Edition contract is based on the ERC-721A contract. 
 
+<ContractDeployCard contractName="Modular Open Edition" href="https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik9wZW5FZGl0aW9uTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+Open+Edition" />
+
 ### Claim Settings
 
 This contract does not require limits to the total supply of NFTs. Any settings related to claim phases may still be applied such as price per NFT, allowlists, start and end times to the phases, and NFTs per wallet. 

apps/portal/src/app/contracts/explore/pre-built-modular/token-drop/page.mdx

@@ -1,4 +1,5 @@
-import { createMetadata, DocImage, Steps, Step, Callout, ContractDeployCard } from "@doc";
+import { createMetadata, DocImage, Steps, Step, Callout} from "@doc";
+import { ContractDeployCard } from "@/components/Document/ContractDeployCard";
 import tokenDropStep1 from './assets/token_drop_step1.png'
 import tokenDropStep2 from './assets/token_drop_step2.png'
 import tokenDropStep3 from './assets/token_drop_step3.png'
@@ -12,6 +13,8 @@ The Token Drop contract creates digital currencies that are released for a set p
 
 Token Drop includes settings called claim conditions which allow deployers to set a prices for tokens per claim phase and limits on how many tokens to be released. These are enabled through the Claimable module.
 
+<ContractDeployCard contractName="Modular Token Drop" href="https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzIwIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token+Drop" />
+
 ### Token vs Token Drop
 
 The Token Drop contract allows users to claim tokens based on specific settings set using Claim Conditions. If you do not need to set limits or special settings on how to claim, refer to the simple [Token contract](https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMjAifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token).

apps/portal/src/app/contracts/explore/pre-built-modular/token/page.mdx

@@ -1,15 +1,21 @@
-import { createMetadata, DocImage, Steps, Step, Callout, ContractDeployCard } from "@doc";
+import { createMetadata, DocImage, Steps, Step, Callout } from "@doc";
+import { ContractDeployCard } from "@/components/Document/ContractDeployCard";
 import tokenStep1 from './assets/token_step1.png'
 import tokenStep2 from './assets/token_step2.png'
 import tokenStep3 from './assets/token_step3.png'
 import tokenTransferable from '../assets/erc20_transferable.png'
 
 
+
+
 # Deploy a modular Token Contract
 
 The modular Token contract creates digital currencies and is compliant with the ERC-20 standard. This contract defines a common set of 
 rules for tokens including how they can be transferred, how transactions are approved, and how data about token balances is accessed.
 
+<ContractDeployCard contractName="Modular Token" href="https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMjAifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token" />
+
+
 ### Token vs Token Drop
 
 The Token contract does not allow users to claim tokens under the criteria of claim conditions. If you would prefer 

apps/portal/src/app/contracts/page.mdx

@@ -6,21 +6,25 @@ export const metadata = createMetadata({
 		"Tools to easily create, deploy, and manage smart contracts on any EVM compatible blockchain.",
 });
 
-# Contracts
+# What are Contracts?
 
-End-to-end tools for smart contract development.
+Contracts is an end-to-end development suite which provides tools to develop, deploy, and manage smart contracts
 
-Trusted, modular smart contracts that can be deployed securely on any EVM chain.
+### Features
+
+- [Explore (Contract Library)](/contracts/explore/overview): Audited and expansive library of contracts deployable with one-click
+- [Modular Contracts](/modular-contracts/overview): Framework to build highly customizable and secure smart contracts
+- [Deployment Tool](/contracts/deploy/overview): Client-side deploy tool to securely deploy any contract to any EVM compatible chain
 
 <OpenSourceCard title="Contracts" href="https://github.com/thirdweb-dev/contracts" />
 
-## Features
+### With Contracts, you can:
 
-- [Explore:](/contracts/explore/overview) Ready to deploy contracts
-- [Build:](/contracts/build/overview) Write your own smart contracts
-- [Deploy:](/contracts/deploy/overview) Contract deployment built for any use-case
-- [Publish:](/contracts/publish/overview) Publish your contracts onchain
-- [Interact:](/contracts) Integrate smart contract interactions directly into your app
+- Easily deploy custom or pre-built contracts to over [2,000+ available EVM networks](https://thirdweb.com/chainlist)
+- Create and publish contracts for your team or community to utilize with an easy-to-deploy interface
+- Create reusable contract components or modules to add to modular contracts to upgrade functionality
+- Manage contract functionality, upload NFTs, set distribution mechanisms, and more directly from the dashboard
+- Reduce development time by using an existing library of contracts with accompanying SDK functions and dashboard integrations to interact with contracts
 
 ### Templates