chore: keep footer white and add top border. refactor PSBT popout

src/app/features/psbt-signer/components/index.ts

@@ -0,0 +1,9 @@
+export { PsbtInputsAndOutputs } from './psbt-inputs-and-outputs/psbt-inputs-and-outputs';
+export { PsbtInputsOutputsTotals } from './psbt-inputs-outputs-totals/psbt-inputs-outputs-totals';
+export { PsbtRequestActions } from './psbt-request-actions';
+export { PsbtRequestDetailsHeader } from './psbt-request-details-header';
+export { PsbtRequestDetailsLayout } from './psbt-request-details.layout';
+export { PsbtRequestFee } from './psbt-request-fee';
+export { PsbtRequestHeader } from './psbt-request-header';
+export { PsbtRequestRaw } from './psbt-request-raw';
+export { PsbtRequestSighashWarningLabel } from './psbt-request-sighash-warning-label';

src/app/features/psbt-signer/components/psbt-request-actions.tsx

@@ -11,7 +11,7 @@ interface PsbtRequestActionsProps {
 export function PsbtRequestActions({ isLoading, onCancel, onSignPsbt }: PsbtRequestActionsProps) {
   return (
     <Footer>
-      <HStack gap="space.04" mt="space.05">
+      <HStack gap="space.04">
         <Button flexGrow={1} onClick={onCancel} variant="outline">
           Cancel
         </Button>

src/app/features/psbt-signer/psbt-signer.tsx

@@ -11,15 +11,7 @@ import { useCurrentAccountNativeSegwitIndexZeroSigner } from '@app/store/account
 import { useCurrentAccountTaprootIndexZeroSigner } from '@app/store/accounts/blockchain/bitcoin/taproot-account.hooks';
 import { PopOutCard } from '@app/ui/components/containers/popout/popout.card';
 
-import { PsbtInputsAndOutputs } from './components/psbt-inputs-and-outputs/psbt-inputs-and-outputs';
-import { PsbtInputsOutputsTotals } from './components/psbt-inputs-outputs-totals/psbt-inputs-outputs-totals';
-import { PsbtRequestActions } from './components/psbt-request-actions';
-import { PsbtRequestDetailsHeader } from './components/psbt-request-details-header';
-import { PsbtRequestDetailsLayout } from './components/psbt-request-details.layout';
-import { PsbtRequestFee } from './components/psbt-request-fee';
-import { PsbtRequestHeader } from './components/psbt-request-header';
-import { PsbtRequestRaw } from './components/psbt-request-raw';
-import { PsbtRequestSighashWarningLabel } from './components/psbt-request-sighash-warning-label';
+import * as PSBT from './components';
 import { useParsedPsbt } from './hooks/use-parsed-psbt';
 import { usePsbtSigner } from './hooks/use-psbt-signer';
 import { PsbtSignerContext, PsbtSignerProvider } from './psbt-signer.context';
@@ -89,22 +81,22 @@ export function PsbtSigner(props: PsbtSignerProps) {
     shouldDefaultToAdvancedView,
   };
 
-  if (shouldDefaultToAdvancedView && psbtRaw) return <PsbtRequestRaw psbt={psbtRaw} />;
+  if (shouldDefaultToAdvancedView && psbtRaw) return <PSBT.PsbtRequestRaw psbt={psbtRaw} />;
 
   return (
     <PsbtSignerProvider value={psbtSignerContext}>
       <PopOutCard>
-        <PsbtRequestHeader name={name} origin={origin} />
-        <PsbtRequestDetailsLayout>
-          {isPsbtMutable ? <PsbtRequestSighashWarningLabel origin={origin} /> : null}
-          <PsbtRequestDetailsHeader />
-          <PsbtInputsOutputsTotals />
-          <PsbtInputsAndOutputs />
-          {psbtRaw ? <PsbtRequestRaw psbt={psbtRaw} /> : null}
-          <PsbtRequestFee fee={fee} />
-        </PsbtRequestDetailsLayout>
+        <PSBT.PsbtRequestHeader name={name} origin={origin} />
+        <PSBT.PsbtRequestDetailsLayout>
+          {isPsbtMutable ? <PSBT.PsbtRequestSighashWarningLabel origin={origin} /> : null}
+          <PSBT.PsbtRequestDetailsHeader />
+          <PSBT.PsbtInputsOutputsTotals />
+          <PSBT.PsbtInputsAndOutputs />
+          {psbtRaw ? <PSBT.PsbtRequestRaw psbt={psbtRaw} /> : null}
+          <PSBT.PsbtRequestFee fee={fee} />
+        </PSBT.PsbtRequestDetailsLayout>
       </PopOutCard>
-      <PsbtRequestActions
+      <PSBT.PsbtRequestActions
         isLoading={isBroadcasting}
         onCancel={onCancel}
         onSignPsbt={() =>

src/app/ui/components/containers/footers/footer.tsx

@@ -19,6 +19,9 @@ export function Footer({ children }: HasChildren) {
       width="100%"
       zIndex={1} // 999 in FormFooter, psbt - check it's OK
       minHeight="95px"
+      // footer is always white
+      backgroundColor="accent.background-primary"
+      borderTop="default"
       // == test this - max-width restricts us in Send flows for example .
       //
       // maxWidth={{ base: '100vw', md: '450px' }}