SELF-1754: polish for document selection for proving flow (#1570)

* change spinner color

* fix disclosure scroll feedback

* fix type error

* fix button scrolling logic

* make the connected wallet static

* fix hold to verify button feedback timing

* formatting

* clean up tex

app/src/components/proof-request/BottomVerifyBar.tsx

@@ -14,6 +14,7 @@ export interface BottomVerifyBarProps {
   onVerify: () => void;
   selectedAppSessionId: string | undefined | null;
   hasScrolledToBottom: boolean;
+  isScrollable: boolean;
   isReadyToProve: boolean;
   isDocumentExpired: boolean;
   testID?: string;
@@ -23,6 +24,7 @@ export const BottomVerifyBar: React.FC<BottomVerifyBarProps> = ({
   onVerify,
   selectedAppSessionId,
   hasScrolledToBottom,
+  isScrollable,
   isReadyToProve,
   isDocumentExpired,
   testID = 'bottom-verify-bar',
@@ -41,6 +43,7 @@ export const BottomVerifyBar: React.FC<BottomVerifyBarProps> = ({
         onVerify={onVerify}
         selectedAppSessionId={selectedAppSessionId}
         hasScrolledToBottom={hasScrolledToBottom}
+        isScrollable={isScrollable}
         isReadyToProve={isReadyToProve}
         isDocumentExpired={isDocumentExpired}
       />

app/src/components/proof-request/ProofRequestCard.tsx

@@ -32,6 +32,7 @@ export interface ProofRequestCardProps {
   documentType?: string;
   timestamp?: Date;
   children?: React.ReactNode;
+  connectedWalletBadge?: React.ReactNode;
   testID?: string;
   onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
   scrollViewRef?: React.RefObject<ScrollViewType>;
@@ -52,6 +53,7 @@ export const ProofRequestCard: React.FC<ProofRequestCardProps> = ({
   documentType = '',
   timestamp,
   children,
+  connectedWalletBadge,
   testID = 'proof-request-card',
   onScroll,
   scrollViewRef,
@@ -111,26 +113,47 @@ export const ProofRequestCard: React.FC<ProofRequestCardProps> = ({
         <View
           flex={1}
           backgroundColor={proofRequestColors.slate100}
-          padding={proofRequestSpacing.cardPadding}
           borderBottomLeftRadius={proofRequestSpacing.borderRadius}
           borderBottomRightRadius={proofRequestSpacing.borderRadius}
         >
-          <ScrollView
-            ref={scrollViewRef}
-            showsVerticalScrollIndicator={true}
-            contentContainerStyle={{ flexGrow: 1 }}
-            onScroll={onScroll}
-            scrollEventThrottle={16}
-            onContentSizeChange={onContentSizeChange}
-            onLayout={onLayout}
-            contentOffset={
-              typeof initialScrollOffset === 'number'
-                ? { x: 0, y: initialScrollOffset }
-                : undefined
+          {/* Connected Wallet Badge - Fixed position under metadata bar */}
+          {connectedWalletBadge && (
+            <View
+              paddingHorizontal={proofRequestSpacing.cardPadding}
+              paddingTop={proofRequestSpacing.cardPadding}
+              paddingBottom={0}
+            >
+              {connectedWalletBadge}
+            </View>
+          )}
+
+          {/* Scrollable Content */}
+          <View
+            flex={1}
+            padding={proofRequestSpacing.cardPadding}
+            paddingTop={
+              connectedWalletBadge
+                ? proofRequestSpacing.itemPadding
+                : proofRequestSpacing.cardPadding
             }
           >
-            {children}
-          </ScrollView>
+            <ScrollView
+              ref={scrollViewRef}
+              showsVerticalScrollIndicator={true}
+              contentContainerStyle={{ flexGrow: 1 }}
+              onScroll={onScroll}
+              scrollEventThrottle={16}
+              onContentSizeChange={onContentSizeChange}
+              onLayout={onLayout}
+              contentOffset={
+                typeof initialScrollOffset === 'number'
+                  ? { x: 0, y: initialScrollOffset }
+                  : undefined
+              }
+            >
+              {children}
+            </ScrollView>
+          </View>
         </View>
       </View>
     </View>