fix

docs/components/Balance.md

@@ -4,7 +4,13 @@ sidebar_position: 2
 
 # Balance
 
-Displays the balance of a given address in both ether (ETH) and US dollars (USD).
+The `Balance` component displays the balance of a given Ethereum (ETH) or Starknet (STRK) address in both its native currency and US dollars (USD). It allows toggling between these two modes and also handles potential errors or loading states.
+
+## Features
+
+- **ETH & STRK Balances:** Shows both Ethereum and Starknet balances for a given address.
+- **USD Conversion:** Option to toggle and display balance in USD, provided the exchange rates are available.
+- **Error & Loading States:** Handles network issues, loading delays, and empty address scenarios gracefully.
 
 ![Balance Example](/img/Balance.gif)
 
@@ -26,3 +32,25 @@ import { Balance } from "~~/components/scaffold-stark";
 | ------------------------ | -------- | ------------- | ------------------------------------------------------------------------------------------------------------------------- |
 | **address**              | `string` | `undefined`   | Address in `0x___` format, it will resolve its Starknet Domain if it has one associated(coming soon).                     |
 | **className** (optional) | `string` | `""`          | Prop to pass additional CSS styling to the component. You can use Tailwind / daisyUI classes like `text-3xl` for styling. |
+| **usdMode** (optional) | `boolean` | `false`          | If true, the balance is displayed in USD. Otherwise, it defaults to ETH/STRK. |
+
+
+## Example
+
+The `Balance` component can be easily customized using Tailwind or daisyUI classes. Here’s a more detailed example of its usage:
+
+```tsx
+<Balance
+  address="0x34aA3F359A9D614239015126635CE7732c18fDF3"
+  className="text-lg text-gray-700 mt-4"
+  usdMode={true}
+/>
+```
+
+This example showcases how to apply additional styling to the component and enables the USD display mode.
+
+
+:::info
+- The component automatically handles loading states, showing a skeleton loader when the balance is being fetched.
+- If the address is invalid or no balance is found, it will show an error message.
+:::

docs/deploying/deploy-faucets.mdx

@@ -0,0 +1,45 @@
+---
+sidebar_position: 3
+toc_max_heading_level: 5
+---
+
+# Faucets 
+
+Faucets for deployment of smart contracts can be requested from the website.
+
+- The button is at the bottom left of the  [Demo app](https://scaffold-stark-demo.vercel.app/)
+
+
+![Faucets Example](/img/faucets.jpg)
+
+ - On clicking on it, You will get a pop up
+
+![Sepolia Example](/img/Sepolia.jpg)
+
+
+## Starknet Sepolia faucets
+
+You can get your faucets in the following websites :
+
+- [Starknet Foundation](https://starknet-faucet.vercel.app/)
+
+- [Alchemy](https://www.alchemy.com/faucets/starknet-sepolia)
+
+- [Blast](https://blastapi.io/faucets/starknet-sepolia-eth)
+
+
+## Devnet Faucets
+
+- To mint tokens, either to an existing address or a new one, use the following command:
+
+```
+curl -d '{"amount":1000000000000000000, "address":"0x064b48806902a367c8598f4f95c305e8c1a1acba5f082d294a43793113115691"}' -H "Content-Type: application/json" -X POST http://localhost:5050/mint
+
+```
+
+- You can also transfer faucets as shown below
+
+- This is made possible following the installation procedures in the Readme file in [Scaffold-stark-2](https://github.com/Scaffold-Stark/scaffold-stark-2)
+
+
+![getFaucets Example](/img/getFaucets.jpg)

docs/recipes/MultiWriteFeature.md

@@ -0,0 +1,189 @@
+---
+sidebar_position: 5
+title: Batching multiple writes to a single transaction
+description: Learn how to perform multiple write operations to StarkNet smart contracts simultaneously.
+---
+
+# Starknet Multi-Write Feature Recipe
+
+This recipe shows how to perform multiple contract write operations in a single transaction using the [`useScaffoldMultiWriteContract`](https://github.com/Scaffold-Stark/scaffold-stark-2/blob/main/packages/nextjs/hooks/scaffold-stark/useScaffoldMultiWriteContract.ts) hook from Scaffold-Stark.
+
+## Overview
+In this guide, we will implement a feature that allows writing to multiple contracts or executing multiple transactions in a single action. This is particularly useful when your decentralized application (dApp) requires multiple state changes at once.
+
+This documentation will walk through the code and steps necessary to create a button that triggers the multi-write contract interaction.
+
+<details open>
+<summary>Here is full implementation of the mult-write feature:</summary>
+
+```tsx title="components/MultiContractInteraction.tsx"
+import { useState } from "react";
+import { useScaffoldMultiWriteContract } from "~~/hooks/scaffold-stark";
+import { notification } from "~~/utils/scaffold-stark";
+
+export const MultiSetData = () => {
+  const [name, setName] = useState("");
+  const [age, setAge] = useState(0);
+
+  const { sendAsync, isPending } = useScaffoldMultiWriteContract({
+    calls: [
+      {
+        contractName: "ProfileContract",
+        functionName: "setName",
+        args: [name],
+      },
+      {
+        contractName: "ProfileContract",
+        functionName: "setAge",
+        args: [age],
+      },
+    ],
+  });
+
+  const handleSetData = async () => {
+    try {
+      await sendAsync();
+      notification("Multi-write successful!", "success");
+    } catch (e) {
+      console.error("Error in multi-write", e);
+      notification("Multi-write failed.", "error");
+    }
+  };
+
+  return (
+    <div>
+      <input
+        type="text"
+        placeholder="Enter your name"
+        className="input border border-primary"
+        onChange={(e) => setName(e.target.value)}
+      />
+      <input
+        type="number"
+        placeholder="Enter your age"
+        className="input border border-primary"
+        onChange={(e) => setAge(Number(e.target.value))}
+      />
+      <button
+        className="btn btn-primary"
+        onClick={handleSetData}
+        disabled={isPending}
+      >
+        {isPending ? (
+          <span className="loading loading-spinner loading-sm"></span>
+        ) : (
+          "Submit"
+        )}
+      </button>
+    </div>
+  );
+};
+
+```
+</details>
+
+## Implementation Guide
+
+### Step 1: Create a New Component
+
+Create a new component in your `component` folder, named `MultiContractInteraction.tsx`. This component will handle multiple write operations on different contracts
+
+
+```tsx title="components/MultiContractInteraction.tsx"
+export const MultiContractInteraction = () => {
+	return <div>Your MultiContractInteraction</div>
+}
+```
+
+### Step 2: Import Required Hooks and Utilities
+
+- import the [`useScaffoldMultiWriteContract`](https://github.com/Scaffold-Stark/scaffold-stark-2/blob/main/packages/nextjs/hooks/scaffold-stark/useScaffoldMultiWriteContract.ts) from scaffold-stark package to handle multiple contract function calls.
+- Use [`
+`](https://github.com/Scaffold-Stark/scaffold-stark-2/blob/main/packages/nextjs/utils/scaffold-stark/notification.tsx) utility to display success or error messages.
+
+```tsx title="components/MultiContractInteraction.tsx"
+import { useScaffoldMultiWriteContract } from "~~/hooks/scaffold-stark";
+import { notification } from "~~/utils/scaffold-stark";
+```
+
+### Step 3: Set Up State Variables
+
+- Use the `useState` hook to track user inputs, `name` and `age`.
+
+```tsx title="components/MultiContractInteraction.tsx"
+const [name, setName] = useState("");
+const [age, setAge] = useState(0);
+```
+
+### Step 4: Configure the [`useScaffoldMultiWriteContract`](https://github.com/Scaffold-Stark/scaffold-stark-2/blob/main/packages/nextjs/hooks/scaffold-stark/useScaffoldMultiWriteContract.ts) Hook
+
+- Configure the hook with the necessary contract calls. Here, we call the `setName` and `setAge` functions of `ProfileContract` in sequence.
+
+```tsx title="components/MultiContractInteraction.tsx"
+const { sendAsync, isPending } = useScaffoldMultiWriteContract({
+  calls: [
+    {
+      contractName: "ProfileContract",
+      functionName: "setName",
+      args: [name],
+    },
+    {
+      contractName: "ProfileContract",
+      functionName: "setAge",
+      args: [age],
+    },
+  ],
+});
+
+```
+
+- The `isPending` variable will manage the loading state of the button, and `sendAsync` will handle the contract transaction.
+
+### Step 5: Handle Submission
+- Create a `handleSetData` function that triggers the multi-write action. If successful, display a success notification; otherwise, log the error and display a failure message.
+
+```tsx title="components/MultiContractInteraction.tsx"
+const handleSetData = async () => {
+  try {
+    await sendAsync();
+    notification("Multi-write successful!", "success");
+  } catch (e) {
+    console.error("Error in multi-write", e);
+    notification("Multi-write failed.", "error");
+  }
+};
+```
+
+### Step 6: Create the UI
+- Add inputs for `name` and `age`, and a button to submit the data.
+- Disable the button while the transaction is pending.
+
+```tsx
+return (
+  <div>
+    <input
+      type="text"
+      placeholder="Enter your name"
+      className="input border border-primary"
+      onChange={(e) => setName(e.target.value)}
+    />
+    <input
+      type="number"
+      placeholder="Enter your age"
+      className="input border border-primary"
+      onChange={(e) => setAge(Number(e.target.value))}
+    />
+    <button
+      className="btn btn-primary"
+      onClick={handleSetData}
+      disabled={isPending}
+    >
+      {isPending ? (
+        <span className="loading loading-spinner loading-sm"></span>
+      ) : (
+        "Submit"
+      )}
+    </button>
+  </div>
+);
+```