From 445ac505378d34a3493fa4a8e2610b50389ce109 Mon Sep 17 00:00:00 2001
From: LandaMm <qwer.009771@gmail.com>
Date: Sat, 7 Jun 2025 19:50:51 +0200
Subject: [PATCH] feat: list of permissions

---
 web/src/pages/Authorize/index.tsx | 27 +++++++++++++++------------
 1 file changed, 15 insertions(+), 12 deletions(-)

diff --git a/web/src/pages/Authorize/index.tsx b/web/src/pages/Authorize/index.tsx
index fe4b9cd..7ad1063 100644
--- a/web/src/pages/Authorize/index.tsx
+++ b/web/src/pages/Authorize/index.tsx
@@ -126,18 +126,21 @@ const AuthorizePage: FC = () => {
             {/* <LogIn className="w-8 h-8 text-gray-700 mb-4" /> */}
             <CardContent className="w-full space-y-4 text-sm">
               <div className="flex flex-col gap-3 mb-8">
-                <div className="flex flex-row items-center justify-between text-gray-600 dark:text-gray-400">
-                  <div className="flex flex-row items-center gap-4">
-                    <div className="w-3 h-3 rounded-full bg-blue-500"></div>
-                    <p>View your full name, email and profile image</p>
-                  </div>
-                </div>
-                <div className="flex flex-row items-center justify-between text-gray-600 dark:text-gray-400">
-                  <div className="flex flex-row items-center gap-4">
-                    <div className="w-3 h-3 rounded-full bg-blue-500"></div>
-                    <p>View your permission from "MDN" group</p>
-                  </div>
-                </div>
+                {(apiService?.scopes?.length ?? 0) > 0 &&
+                  apiService!.scopes.map((scope) => (
+                    <div className="flex flex-row items-center justify-between text-gray-600 dark:text-gray-400">
+                      <div className="flex flex-row items-center gap-4">
+                        <div className="w-3 h-3 rounded-full bg-blue-500"></div>
+                        <p>View your full name, email and profile image</p>
+                        <p>
+                          {scope === "openid" &&
+                            "Access your account id and use it"}
+                          {scope === "email" && "View your email address"}
+                          {scope === "profile" && "View your profile image"}
+                        </p>
+                      </div>
+                    </div>
+                  ))}
               </div>
 
               <div className="mb-10">