Add Vyper documentation (#27)

* Add Vyper documentation

* update styles for AvailableOnlyForSolidityAdmonition

* update styles for AvailableOnlyForSolidityAdmonition content

* Enhance documentation for immutables and Vyper verification processes

* update transformations support in vyper page

Author: marcocastignoli

Diff for: docs/3. Verification/1.howToVerify.mdx

@@ -4,8 +4,12 @@ title: How to Verify Contracts
 slug: /how-to-verify
 ---
 
+import AvailableOnlyForSolidityAdmonition from "../AvailableOnlyForSolidityAdmonition";
+
 # How to Verify Contracts
 
+<AvailableOnlyForSolidityAdmonition description="Vyper contracts are verifiable only using the dedicated /verify/vyper API enpoint. UI, frameworks and tools don't support Vyper verification via Sourcify yet."/>
+
 ## Using the UI (legacy)
 
 1. Drag and drop the folder containing your source files and metadata, or add them seperately.

Diff for: docs/3. Verification/2 .fullVsPartialMatch.md

@@ -4,6 +4,8 @@ title: Full vs Partial Match
 slug: /full-vs-partial-match
 ---
 
+import AvailableOnlyForSolidityAdmonition from "../AvailableOnlyForSolidityAdmonition";
+
 # Matches
 
 A Sourcify match in summary works as follows:
@@ -21,6 +23,8 @@ If the bytecode from recompiling the contract with the given source code files a
 
 ## Full (Perfect) Matches
 
+<AvailableOnlyForSolidityAdmonition description="Vyper contracts don't support full matches because Vyper doesn't include the metadata hash in the bytecode."/>
+
 Full matches (sometimes referred as _perfect matches_) refer to the cases when the bytecode of the deployed contract is byte-by-byte the same as compilation output of the given source code files under the compilation settings defined in the [metadata file](/docs/metadata).
 
 This means the contents of the source code files and the compilation settings are exactly the same as when the contract author compiled and deployed the contract. Not even a byte! If you were to add a comment, change a variable or function name, the full match will be broken.

Diff for: docs/3. Verification/3. libraries.md

@@ -4,8 +4,12 @@ title: Libraries
 slug: /libraries
 ---
 
+import AvailableOnlyForSolidityAdmonition from "../AvailableOnlyForSolidityAdmonition";
+
 # Verification with Libraries
 
+<AvailableOnlyForSolidityAdmonition description="Vyper contracts don't support libraries."/>
+
 Normally when a contract has linked libraries these are noted in the `libraries` field in the metadata:
 
 [/partial_match/1/0x2fefbeF4d1445F523941c56349C2414cd5e9675d/metadata.json](https://repo.sourcify.dev/contracts/partial_match/1/0x2fefbeF4d1445F523941c56349C2414cd5e9675d/metadata.json)

Diff for: docs/3. Verification/4. immutables.md

@@ -6,11 +6,13 @@ slug: /immutables
 
 # Verification with Immutable Varibles
 
-While Sourcify can verify contracts containing immutable variables, the process is more intricate than verifying contracts that don't have immutables. First, Sourcify recompiles the contract, which produces the runtime bytecode and the `immutableReferences` object. This object indicates the specific position within the execution bytecode where the immutable variables are located. After obtaining these, the next step is to replace all instances of the immutables in both the runtime and deployed bytecodes with zeros. Finally, a direct comparison is made between the two bytecodes to get a full or a partial match.
+## Solidity
+
+While Sourcify can verify **Solidity** contracts containing immutable variables, the process is more intricate than verifying contracts that don't have immutables. First, Sourcify recompiles the contract, which produces the runtime bytecode and the `immutableReferences` object. This object indicates the specific position within the execution bytecode where the immutable variables are located. After obtaining these, the next step is to replace all instances of the immutables in both the runtime and deployed bytecodes with zeros. Finally, a direct comparison is made between the two bytecodes to get a full or a partial match.
 
 More details on how immutables affect verification below:
 
-## Immutable variables
+### Immutable variables
 
 It is not as straightforward to verify contracts with immutable variables because of their nature. Quoting from the [Solidity docs](https://docs.soliditylang.org/en/v0.8.14/contracts.html#constant-and-immutable-state-variables):
 
@@ -30,3 +32,28 @@ For example in the bytecode excerpt from the Görli contract 0xbdde4d595f2cdda92
 ...282565b5050565b7f000000000000000000000000000000000000000000000000000000000000000281565b828054600181600116156101...
                                                                                   ☝️
 ```
+
+## Vyper
+
+Sourcify supports verification of Vyper contracts containing immutable variables. Here's how it works:
+
+1. **CBOR auxdata**: Vyper appends an array in CBOR format at the end of the creation bytecode. This array contains the following elements:
+   ```
+   [
+     integrity_hash,    // Hash of the contract's source code, included starting with Vyper 0.4.1
+     runtime_size,      // Size of the runtime bytecode
+     data_sizes,        // Array of data section sizes
+     immutable_size,    // Total size of all immutable variables
+     compiler          // Compiler information, e.g. {"vyper": [0, 4, 0]}
+   ]
+   ```
+
+   Example CBOR data: `[167, [10], 96, {"vyper": [0, 4, 0]}]`
+
+2. **Locating Immutables**: To find the immutable values:
+   - Look at the deployed runtime bytecode
+   - Take the last `immutable_size` bytes - these contain the actual values of the immutables
+
+3. **Verification Process**: To verify the contract:
+   - Remove the immutable values from the onchain runtime bytecode (by truncating the last `immutable_size` bytes)
+   - Compare this with the recompiled bytecode

Diff for: docs/3. Verification/8. Etherscan.mdx

@@ -4,9 +4,13 @@ title: Import from Etherscan
 slug: /etherscan
 ---
 
+import EtherscanInstances from "./etherscanInstancesTable.tsx";
+import AvailableOnlyForSolidityAdmonition from "../AvailableOnlyForSolidityAdmonition";
+
 # Import from Etherscan
 
-import EtherscanInstances from "./etherscanInstancesTable.tsx";
+<AvailableOnlyForSolidityAdmonition description="Import for Etherscan is available only for Solidity contracts."/>
+
 
 It is possible to import contracts already verified on Etherscan instances.
 

Diff for: docs/3. Verification/9. vyper.md

@@ -0,0 +1,21 @@
+---
+id: vyper
+title: Vyper verification
+slug: /vyper
+---
+
+# Vyper verification
+
+Sourcify supports Vyper verification via the `/verify/vyper` API endpoint, you can find more information in the [APIs documentation](/docs/api/).
+
+Vyper doesn't support [metadata](/docs/metadata/), so most of Sourcify features are not available for Vyper.
+
+## Vyper Feature Support
+
+- 🟢 **Partial match**: Sourcify uses the metadata hash as a compilation fingerprint (you can read more about it [here](/docs/full-vs-partial-match)), since Vyper doesn't support metadata, every Vyper match will result in a partial match. Starting from version 0.4.1 Vyper implements a similar concept called [integrity](https://docs.vyperlang.org/en/stable/compiling-a-contract.html#integrity-hash), but Sourcify doesn't support it yet.
+- 🟢 **Database transformations**: For more details, see the [Sourcify Database section](/docs/repository/sourcify-database/). Currently, Vyper verification supports `cborAuxdata`, `immutable` and `constructorArguments` transformations.
+- 🟢 **Generated metadata**: Sourcify generates a metadata file for Vyper contracts, but it's used only for compatibility with the [Sourcify File Repositories](/docs/repository/file-repositories/).
+- 🟡 **IPFS support**: Sourcify automatically uploads all verified contract's sources to IPFS. Even if the files are on IPFS, there is no link to them in the Vyper contract's bytecode. This is because Vyper doesn't include the metadata IPFS CID in the bytecode's auxdata.
+- 🔴 **Full match**: Not possible due to lack of metadata support.
+- 🔴 **Verification via UI**: Sourcify UI is based on the metadata and uses the statfull `/session/*` API endpoints, currently Sourcify support Vyper verification only via the stateless `/verify/vyper` API endpoint.
+- 🔴 **Monitoring**: Monitor listens for `create` operations on many chains. It attempts to fetch the sources of deployed contracts from IPFS using the metadata embedded in the bytecodes. Since Vyper doesn't support metadata, Sourcify can't fetch the sources from IPFS.

Diff for: docs/6. monitoring.md

@@ -4,8 +4,12 @@ title: Monitoring Service
 slug: /monitoring
 ---
 
+import AvailableOnlyForSolidityAdmonition from "./AvailableOnlyForSolidityAdmonition";
+
 # Monitoring Service
 
+<AvailableOnlyForSolidityAdmonition description="Sourcify monitoring service uses the metadata file to retrieve the source files. Vyper contracts don't support this."/>
+
 Sourcify runs a "monitor" that listens to certain chains and checks contract creations (currently only checking tx's with `tx.to === null` and can't catch evm level contract creations). You can see which chains are monitored in [Supported Chains](/docs/chains/) table under "Monitoring" column.
 
 If the monitor notices a contract creation it checks the contract bytecode for the appended metadata hash and will try to fetch the metadata file from Swarm or IPFS. If it succeeds, it further tries to fetch the source files. The source files will be either embedded in the metadata file in text form, or they will have IPFS hashes in the metadata file. If all the files are found, the monitor tries to compile and verify the detected contract with the fetched files.

Diff for: docs/9. metadata.mdx

@@ -4,8 +4,12 @@ title: Contract Metadata
 slug: /metadata
 ---
 
+import AvailableOnlyForSolidityAdmonition from "./AvailableOnlyForSolidityAdmonition";
+
 # Contract metadata
 
+<AvailableOnlyForSolidityAdmonition description="Vyper contracts don't support metadata."/>
+
 ## Metadata
 
 Since [v0.4.7](https://github.com/ethereum/solidity/releases/tag/v0.4.7) (2016-12-15) Solidity compiler generates an output file called metadata that contains information about the contract and the compilation ([see Solidity docs](https://docs.soliditylang.org/en/latest/metadata.html)). This includes the compiler settings, [contract ABI](https://docs.soliditylang.org/en/latest/abi-spec.html), [NatSpec contract documentation](https://docs.soliditylang.org/en/latest/natspec-format.html), and used source files and their hashes. Sourcify takes full advantage of this information to [fully verify](/docs/full-vs-partial-match) a deployed contract i.e. a byte-by-byte match of the contract. **Metadata file is required for the Sourcify verification** alongside the Solidity source files.

Diff for: docs/98. F.A.Q..md

@@ -47,7 +47,7 @@ Some resources on how it's done:
 
 ### Do you support other languages such as Vyper, Fe etc. ?
 
-Sourcify is currently Solidity only.
+Sourcify supports Solidity and Vyper only.
 
 ### I want to download the complete Sourcify repository, is it possible?
 

Diff for: docs/AvailableOnlyForSolidityAdmonition.tsx

@@ -0,0 +1,84 @@
+import React from "react";
+
+const SolidityLogo = () => {
+  return (
+    <svg
+      style={{
+        width: "0.9rem",
+        verticalAlign: "middle",
+        marginLeft: "0.8rem",
+        marginRight: "0.4rem",
+      }}
+      viewBox="0 0 100 160"
+      focusable="false"
+    >
+      <path
+        opacity="0.8"
+        d="M50 44.3013L25 1L0 44.3013L25 87.6025L50 44.3013Z"
+      ></path>
+      <path
+        opacity="0.45"
+        d="M50 44.3091L75 1.00781L25 1.00781L0 44.3091H50Z"
+      ></path>
+      <path
+        opacity="0.6"
+        d="M75 1.00781L25 1.00781L50 44.3091H100L75 1.00781Z"
+      ></path>
+      <path
+        opacity="0.8"
+        d="M50 115.699L75 159L100 115.699L75 72.3975L50 115.699Z"
+      ></path>
+      <path
+        opacity="0.45"
+        d="M50 115.691L25 158.993H75L100 115.691L50 115.691Z"
+      ></path>
+      <path
+        opacity="0.6"
+        d="M25 158.993H75L50 115.691L0 115.691L25 158.993Z"
+      ></path>
+    </svg>
+  );
+};
+
+export default ({ description }: { description: string }) => {
+  return (
+    <div>
+      <div
+        className="theme-admonition theme-admonition-tip alert alert--info"
+        style={{
+          marginBottom: "1em",
+        }}
+      >
+        <div
+          style={{
+            font: "var(--ifm-heading-font-weight) var(--ifm-h5-font-size)/var(--ifm-heading-line-height) var(--ifm-heading-font-family)",
+            marginBottom: "0.3rem",
+            textTransform: "uppercase",
+          }}
+        >
+          <span
+            style={{
+              verticalAlign: "middle",
+            }}
+          >
+            Available only for
+          </span>
+          <SolidityLogo />
+          <span
+            style={{
+              fontSize: "1.1rem",
+              verticalAlign: "middle",
+              textTransform: "capitalize",
+              color: "#1a1b1c",
+            }}
+          >
+            Solidity
+          </span>
+        </div>
+        <div>
+          <p style={{ marginBottom: "0" }}>{description}</p>
+        </div>
+      </div>
+    </div>
+  );
+};

Diff for: src/css/custom.css

@@ -68,6 +68,9 @@ html[data-theme="dark"] .navbar__title {
   justify-content: center;
 }
 @import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=VT323&display=swap");
+/** Font for Solidity logo */
+@import url("https://fonts.cdnfonts.com/css/overpass");
+@import url("https://fonts.cdnfonts.com/css/overpass-mono");
 
 .menu__link--active:not(.menu__link--sublist) {
   background: var(--ifm-color-primary-lightestest);