Merge branch 'main' into docs/tooltip

docs/learn/mini-apps/connect-upprovider.md

@@ -1,33 +1,44 @@
 ---
-sidebar_label: '🔌 Connect to a mini-app'
-description: 'How to connect your mini-app using the UP Provider'
+sidebar_label: '🔌 Connect to a Mini-App'
+description: 'How to connect your Mini-App using the UP Provider'
 sidebar_position: 1
 ---
 
-# Connect to a mini-app
+# Connect to a Mini-App
 
 <img width="300" alt="Screenshot 2025-01-27 at 14 15 22" src="https://github.com/user-attachments/assets/7f0b7875-c402-440d-b77f-935cf90f241d" align="right" />
 
-Mini-apps are dApps that run in an iframe of a parent page that hosts them. [universaleverything.io](https://universaleverything.io) is such a website.
-An example of mini-apps can be found at [the app-store profile](https://universaleverything.io/0x7b258dD350227CFc9Da1EDD7f4D978f7Df20fD40) (See on the right).
+## What are Mini-Apps?
 
-For users connecting to a mini-app would mean to connect to each mini-app via a connect button, web3 modal, or wallet connect process. This makes connecting to mini-apps cumbersome and not fun.
+Mini-Apps are dApps that run in an iframe of a parent page that hosts them. You can see [examples of Mini-Apps in action on universaleverything.io](https://universaleverything.io/0x7b258dD350227CFc9Da1EDD7f4D978f7Df20fD40).
 
-The [up-provider](https://github.com/lukso-network/tools-up-provider) solves this by giving mini-apps a way for the user visiting the parent page, to connect to the mini-app directly with one-click.
+## The Challenge with Mini-Apps
 
-**Additionally the mini-app has access to `context addresses`**, which in the case of [universaleverything.io](https://universaleverything.io) is the universal profile under which the mini-app is hosted.
+Traditionally, users would need to connect to each Mini-App individually through:
 
-The up-provider is a [EIP-1193](https://eips.ethereum.org/EIPS/eip-1193) compatible provider, meaning it will work with all major web3 libraries. For examples using viem, web3.js or ethers, [see the readme of the up-provider](https://github.com/lukso-network/tools-up-provider/blob/main/README.md#provider-for-mini-apps).
+- Connect buttons
+- Web3 modals
+- WalletConnect processes
+
+This makes the user experience cumbersome.
+
+## Introducing the UP Provider
+
+The [up-provider](../../tools/dapps/up-provider/getting-started) solves this by giving Mini-Apps a way for the user visiting the parent page, to connect to the Mini-App directly with one-click.
+
+Additionally, **the Mini-App has access to `context addresses`**, which in the case of [universaleverything.io](https://universaleverything.io) is the Universal Profile under which the Mini-App is hosted in the Grid.
+
+> The up-provider is a [EIP-1193](https://eips.ethereum.org/EIPS/eip-1193) compatible provider, meaning it will work with all major web3 libraries. For examples using viem, web3.js or ethers, [see the readme of the up-provider](https://github.com/lukso-network/tools-up-provider/blob/main/README.md#provider-for-mini-apps).
 
 ## Installation
 
 ```bash
 npm install @lukso/up-provider
 ```
 
-## Example implementation using react
+## Example implementation using React
 
-Here's a step-by-step guide to implement UP Provider connection in your react application:
+Here's a step-by-step guide to implement UP Provider connection in your React application:
 
 1. First, import the necessary dependencies:
 

docs/learn/mini-apps/testing-miniapps.md

@@ -1,12 +1,12 @@
 ---
 sidebar_label: '🧪 Testing Mini-Apps Locally'
-description: 'How to run and test your mini-app locally'
+description: 'How to run and test your Mini-App locally'
 sidebar_position: 2
 ---
 
 # 🧪 Testing Mini-Apps Locally
 
-To test mini-apps in action on Universal Everything, we need to expose our mini-app to an URL that can be accessed by the UP Provider.
+To test Mini-Apps in action on Universal Everything, we need to expose our Mini-App to an URL that can be accessed by the UP Provider.
 
 We will be using [localtunnel](https://github.com/localtunnel/localtunnel) for this purpose.
 
@@ -23,10 +23,10 @@ npm install -g localtunnel
 In a new terminal window, run the following command:
 
 ```bash
-lt --port <PORT> // localhost port that your mini-app is running on (e.g. 3000)
+lt --port <PORT> // localhost port that your Mini-App is running on (e.g. 3000)
 ```
 
-Running the command will generate a random URL. Initial visit to this URL will ask for a password, you can use **your IP address** to access your mini-app.
+Running the command will generate a random URL. Initial visit to this URL will ask for a password, you can use **your IP address** to access your Mini-App.
 
 ![localtunnel-visit](/img/learn/localtunnel-visit.png)
 
@@ -38,4 +38,4 @@ If you don't have your IP address in hand, you can visit the URL on the page to
 
 ## Test your Mini-App on Universal Everything
 
-Go to your Universal Profile on Universal Everything, and add your mini-app with using the provided URL to your Grid.
+Go to your Universal Profile on Universal Everything, and add your Mini-App with using the provided URL to your Grid.

src/accordion.js

@@ -158,6 +158,33 @@ const accordionData = [
       },
     ],
   },
+  {
+    summary: 'Mini-Apps',
+    icon: 'material-symbols:counter-1',
+    details: [
+      {
+        question: 'What is a Mini-App?',
+        answer:
+          'Mini-App is a dApp that run in an iframe of a parent page that hosts them. You can then add them to your Grid on Universal Everything.',
+        link: '/learn/mini-apps/connect-upprovider',
+        linkLabel: 'Learn more',
+      },
+      {
+        question: 'How does a Mini-App connect to a user?',
+        answer:
+          'The UP Provider empowers the Mini-Apps to connect to the user visiting the parent page with one-click.',
+        link: '/learn/mini-apps/connect-upprovider#introducing-the-up-provider',
+        linkLabel: 'Learn more about UP Provider',
+      },
+      {
+        question: 'How do I test Mini-Apps locally?',
+        answer:
+          'To test Mini-Apps locally on Universal Everything, you need to expose your Mini-App to an URL. Check out our guide to learn how to do this with localtunnel.',
+        link: '/learn/mini-apps/testing-miniapps',
+        linkLabel: 'See guide',
+      },
+    ],
+  },
   {
     summary: 'Network & Validators',
     icon: 'material-symbols:counter-1',