feat: add TokenSymbol component and update documentation references

Author: Le-Caignec

src/components/TokenSymbol.vue

@@ -0,0 +1,25 @@
+<template>
+  <span class="font-semibold text-inherit">{{ tokenSymbol }}</span>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue';
+import useUserStore from '@/stores/useUser.store';
+
+const userStore = useUserStore();
+
+// Computed property to get the correct token symbol based on selected chain
+const tokenSymbol = computed(() => {
+  const currentChainId = userStore.getCurrentChainId();
+  
+  // Bellecour (0x86) uses xRLC, Arbitrum (42161) uses RLC
+  if (currentChainId === 0x86) {
+    return 'xRLC';
+  } else if (currentChainId === 42161) {
+    return 'RLC';
+  }
+  
+  // Default fallback
+  return 'RLC';
+});
+</script>

src/get-started/overview/what-is-iexec.md

@@ -38,14 +38,14 @@ providing a decentralized infrastructure that combines:
 3. **⚙️ Worker Network**
    - Distributed computing providers
    - Execute iApps securely
-   - Earn RLC tokens for contributions
+   - Earn <TokenSymbol /> tokens for contributions
 
 ## 🚀 **Key Features**
 
 - **TEE (Trusted Execution Environment)** support
 - **Zero-knowledge computation**
 - **Decentralized marketplace** for computing resources
-- **RLC token** for payments and governance
+- **<TokenSymbol /> token** for payments and governance
 - **Cross-chain compatibility**
 
 ## 🔗 **Get Started**
@@ -55,3 +55,7 @@ Ready to explore iExec? Check out:
 - [What is Protected Data?](/get-started/overview/what-is-protected-data)
 - [What is an iApp?](/get-started/overview/what-is-iapp)
 - [Hello World Tutorial](/get-started/helloWorld)
+
+<script setup>
+import TokenSymbol from '@/components/TokenSymbol.vue'
+</script>

src/get-started/protocol/worker/manage-access.md

@@ -44,7 +44,7 @@ your workerpool:
 | key                 | description                                                                          |
 | ------------------- | ------------------------------------------------------------------------------------ |
 | `workerpool`        | workerpool address                                                                   |
-| `workerpoolprice`   | price to charge the requester for each execution of the app (in nRLC)                |
+| `workerpoolprice`   | price to charge the requester for each execution of the app (in nano <TokenSymbol />)                |
 | `volume`            | number of authorized uses, each use decreases this number                            |
 | `tag`               | restrict usage to a specific runtime such as **Scone** or **Gramine** TEE frameworks |
 | `category`          | Order category, will define the deal `workClockTimeRef` and its deadlines            |
@@ -106,3 +106,7 @@ cancel command.
 ```bash
 iexec order cancel --workerpool <orderHash>
 ```
+
+<script setup>
+import TokenSymbol from '@/components/TokenSymbol.vue'
+</script>

src/get-started/protocol/worker/quick-start.md

@@ -14,11 +14,11 @@ The iExec Worker participates in a workerpool by computing tasks purchased by
 requesters on the iExec marketplace. The iExec Worker must connect to the iExec
 Core Scheduler of the workerpool to actively participate in the computation.
 
-A worker will be rewarded with RLC for every properly computed tasks.
+A worker will be rewarded with <TokenSymbol /> for every properly computed tasks.
 
 Please note that:
 
-- your wallet must be loaded with RLC. Some RLC must be deposited to your iExec
+- your wallet must be loaded with <TokenSymbol />. Some <TokenSymbol /> must be deposited to your iExec
   account in order to stake for incoming tasks.
 - your computer needs at least 2 CPUs.
 
@@ -33,14 +33,18 @@ configuration documentation of the
 For security reason, it is **highly recommended** to launch your worker in a
 virtual machine.
 
-After having loaded some RLC and deposited them to your iExec account, you can
+After having loaded some <TokenSymbol /> and deposited them to your iExec account, you can
 start your worker.
 
 When the worker initialization process is complete, the worker will be started
 and you will get something like: **You worker is all set**. Your worker will now
-be able to compute some tasks coming from the iExec network to earn some RLCs.
+be able to compute some tasks coming from the iExec network to earn some <TokenSymbol />s.
 
 ## Wallet restriction
 
 An exclusive wallet must be associated to your worker. You need N wallets if you
 want N workers.
+
+<script setup>
+import TokenSymbol from '@/components/TokenSymbol.vue'
+</script>

src/guides/build-iapp/manage-access.md

@@ -40,7 +40,7 @@ Here's the simplified process:
 2. **You sign the order** with your wallet
 3. **You publish the order** on the iExec marketplace
 4. **Users can discover** and execute your iApp according to your conditions
-5. **You automatically receive** payment in RLC for each execution
+5. **You automatically receive** payment in <TokenSymbol /> for each execution
 
 ```
 Deployed iApp + Signed App Order = Application accessible on iExec
@@ -231,12 +231,12 @@ Here's the detailed description of each parameter:
 **Common values:**
 
 - `"0"` - Free
-- `"1000000000"` - 1 RLC per execution
-- `"500000000"` - 0.5 RLC per execution
+- `"1000000000"` - 1 <TokenSymbol /> per execution
+- `"500000000"` - 0.5 <TokenSymbol /> per execution
 
 ::: tip
 
-1 RLC = 1,000,000,000 nRLC (10^9)
+1 <TokenSymbol /> = 1,000,000,000 nano <TokenSymbol /> (10^9)
 
 :::
 
@@ -301,3 +301,7 @@ Next steps:
   Complete CLI reference
 - **[Official Orders Documentation](https://protocol.docs.iex.ec/for-developers/advanced/manage-your-apporders)** -
   Protocol-level order management
+
+<script setup>
+import TokenSymbol from '@/components/TokenSymbol.vue'
+</script>

src/guides/manage-data/manage-access.md

@@ -190,7 +190,7 @@ yourself!
 Set to `0` for free access, or specify a price to monetize your data
 automatically.
 
-**Example**: `pricePerAccess: 1_000_000_000` = 1 RLC per access
+**Example**: `pricePerAccess: 1_000_000_000` = 1 <TokenSymbol /> per access
 
 → **Want to learn more monetization capabilities?** See our detailed
 [Monetize Protected Data guide](/guides/manage-data/monetize-protected-data)
@@ -232,4 +232,5 @@ steps:
 <script setup>
 import RequiredBadge from '@/components/RequiredBadge.vue'
 import OptionalBadge from '@/components/OptionalBadge.vue'
+import TokenSymbol from '@/components/TokenSymbol.vue'
 </script>

src/guides/use-iapp/getting-started.md

@@ -17,7 +17,6 @@ Before you begin, make sure you have:
 - Some RLC tokens for paying computation fees (or access to free vouchers
   through learning programs) - [Learn about RLC tokens](/get-started/rlc) and
   [how to bridge them](/get-started/tooling-and-explorers/bridge)
-  - **Note**: On Arbitrum, you'll need AETH (Arbitrum ETH) instead of RLC
 - Basic understanding of blockchain transactions
 - iExec SDK installed
 

src/guides/use-iapp/how-to-pay-executions.md

@@ -14,7 +14,7 @@ and cost management strategies.
 
 iExec supports multiple payment methods for executing iApps:
 
-1. **RLC Tokens**: Direct payment using RLC (Request Compute Language) tokens
+1. **RLC Tokens**: Direct payment using <TokenSymbol /> tokens
 2. **Vouchers**: Pre-funded vouchers for simplified payment
 3. **Mixed Payment**: Combination of RLC and vouchers
 
@@ -120,7 +120,7 @@ const result = await dataProtectorCore.processProtectedData({
 
 ::: tip
 
-If your voucher doesn't have enough xRLC to cover the deal, the SDK will
+If your voucher doesn't have enough <TokenSymbol /> to cover the deal, the SDK will
 automatically get the required amount to your iExec account. Ensure that your
 voucher is authorized to access your iExec account and that your account has
 sufficient funds for this transfer to proceed.
@@ -496,4 +496,5 @@ Now that you understand payment methods:
 
 <script setup>
 import ChainNotSupportedBadge from '@/components/ChainNotSupportedBadge.vue'
+import TokenSymbol from '@/components/TokenSymbol.vue'
 </script>

src/guides/use-iapp/how-to-pay/how-to-pay-for-web3mail.md

@@ -2,7 +2,7 @@
 title: How to Pay for Web3Mail
 description:
   Learn how to pay for Web3Mail's confidential computing power using vouchers
-  and xLC for secure, blockchain-based email communication.
+  and RLC for secure, blockchain-based email communication.
 ---
 
 # How to Pay for Web3Mail
@@ -14,7 +14,7 @@ The `sendEmail` function uses confidential computing power to encrypt and send
 messages, ensuring secure and decentralized email exchanges.
 
 This guide explains how to pay for Web3Mail's computing power using **vouchers**
-and **xRLC**, detailing the steps for each method.
+and **<TokenSymbol />**, detailing the steps for each method.
 
 ## Using Vouchers for Web3Mail <ChainNotSupportedBadge />
 
@@ -52,8 +52,8 @@ contract to debit your account if the voucher balance is insufficient. This
 ensures that if the voucher alone doesn't cover the execution cost, the
 remaining balance is automatically deducted from your account.
 
-For additional information on using xRLC for fallback payment in Web3Mail, refer
-to the **Using xRLC with Web3Mail** section.
+For additional information on using <TokenSymbol /> for fallback payment in Web3Mail, refer
+to the **Using <TokenSymbol /> with Web3Mail** section.
 
 ### Step 4: Execute Web3Mail's SendEmail Function
 
@@ -73,17 +73,17 @@ const sendEmail = await web3mail.sendEmail({
 });
 ```
 
-## Using xRLC for Web3Mail
+## Using <TokenSymbol /> for Web3Mail
 
-If you choose to use xRLC to cover the computational cost of Web3Mail (or if you
+If you choose to use <TokenSymbol /> to cover the computational cost of Web3Mail (or if you
 need to cover data access costs such as retrieving the recipient's email
 address), follow these steps:
 
 ### Install the iExec SDK
 
 To manage RLC tokens, developers must use the iExec SDK, which offers all the
 necessary tools for interacting with the iExec platform. This includes
-depositing, withdrawing, and checking balances of RLC and xRLC
+depositing, withdrawing, and checking balances of RLC and <TokenSymbol />
 
 - In your JS/TS project npm install iexec
 - Instantiate the iExec SDK (see the
@@ -97,32 +97,19 @@ const iexec = new IExec({ ethProvider: window.ethereum });
 
 ### Purchase RLC
 
-Obtain RLC tokens from a supported cryptocurrency exchange.
+Obtain RLC tokens from a supported cryptocurrency exchange. For detailed information on how to buy RLC tokens, see our [RLC Token guide](/get-started/rlc) which covers all available DEX and CEX supported.
 
-### Convert to xRLC
+For detailed instructions on how to bridge RLC tokens between networks, see our [Bridge guide](/get-started/tooling-and-explorers/bridge) which covers all supported networks and bridging methods.
 
-Use the iExec Bridge to convert your RLC into xRLC for use on iExec's sidechain.
-The bridging operation follows the lock & mint / burn & unlock principle. When
-sending tokens from Mainnet to Bellecour, the bridge locks the initial amount on
-the source chain and mints the equivalent on the destination chain. When going
-in the other direction, it burns tokens on the Sidechain and unlocks the same
-amount on Mainnet. The bridged asset is called xRLC on Bellecour.
+### Deposit <TokenSymbol />
 
-Users can send tokens from the Ethereum Mainnet to the iExec Sidechain or
-vice-versa using the Account Manager
-([iExec Explorer](https://explorer.iex.ec/bellecour) or
-[POA Bridge UI](https://bridge-bellecour.iex.ec/)) available across all iExec
-products.
-
-### Deposit xRLC
-
-Deposit the xRLC into your iExec account using the command:
+Deposit the <TokenSymbol /> into your iExec account using the command:
 
 ```javascript
-iexec.account.deposit(xRLC_amount);
+iexec.account.deposit(RLC_amount);
 ```
 
-This converts xRLC into sRLC, used as proof of funds for task execution.
+This converts <TokenSymbol /> into sRLC, used as proof of funds for task execution.
 
 ### Check sRLC Balance
 
@@ -135,7 +122,7 @@ iexec.account.show();
 ### Execute sendEmail
 
 Set the `useVoucher` parameter to `false` when using Web3Mail's sendEmail
-function to pay with xRLC:
+function to pay with <TokenSymbol />:
 
 ```ts twoslash
 import { IExecWeb3mail, getWeb3Provider } from '@iexec/web3mail';
@@ -153,7 +140,7 @@ const sendEmail = await web3mail.sendEmail({
 
 ### Withdraw sRLC (If Desired)
 
-Convert sRLC back to xRLC and withdraw to your wallet using:
+Convert sRLC back to <TokenSymbol /> and withdraw to your wallet using:
 
 ```javascript
 iexec.account.withdraw(RLC_amount);
@@ -163,4 +150,5 @@ iexec.account.withdraw(RLC_amount);
 // Assets
 import builderDashboardImage from '@/assets/tooling-&-explorers/builder-dashboard/builder-dashboard.png';
 import ChainNotSupportedBadge from '@/components/ChainNotSupportedBadge.vue'
+import TokenSymbol from '@/components/TokenSymbol.vue'
 </script>