feat: enhance Mini App design guidelines and refactor layout components

- Updated Mini App design guidelines to include detailed instructions on UI changes, accessibility rules, and verification processes.
- Refactored multiple components to utilize `MiniAppScreen` and `MiniAppScreenContent` for consistent layout structure across the application.
- Improved error handling in `GlobalError` and `NotFound` components by integrating new layout components for better user experience.
- Introduced new hooks for admin functionality, streamlining access checks and data loading processes.
- Enhanced documentation to reflect changes in design policies and component usage, ensuring clarity for future development.

webapp-next/src/components/ui/sheet.tsx

@@ -54,6 +54,7 @@ function SheetContent({
   onCloseAnimationEnd,
   onAnimationEnd,
   overlayClassName,
+  closeLabel = "Close",
   ...props
 }: React.ComponentProps<typeof SheetPrimitive.Content> & {
   side?: "top" | "right" | "bottom" | "left"
@@ -62,6 +63,8 @@ function SheetContent({
   onCloseAnimationEnd?: () => void
   /** Optional class name applied to the overlay (e.g. backdrop-blur-md). */
   overlayClassName?: string
+  /** Accessible label for the close button text (sr-only). */
+  closeLabel?: string
 }) {
   const useForceMount = Boolean(onCloseAnimationEnd)
 
@@ -103,7 +106,7 @@ function SheetContent({
         {showCloseButton && (
           <SheetPrimitive.Close className="absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-secondary">
             <XIcon className="size-4" />
-            <span className="sr-only">Close</span>
+            <span className="sr-only">{closeLabel}</span>
           </SheetPrimitive.Close>
         )}
       </SheetPrimitive.Content>