1388 test wallet new design transfer pages

packages/boutique/backend/src/order/controller.ts

@@ -3,6 +3,7 @@ import { IOrderService } from './service'
 import { Order } from './model'
 import {
   BadRequest,
+  Unauthorized,
   Controller,
   InternalServerError,
   toSuccessResponse
@@ -20,6 +21,7 @@ import {
   setupFinishSchema,
   oneClickSetupSchema
 } from '@boutique/shared'
+import { OpenPaymentsClientError } from '@interledger/open-payments'
 
 interface GetParams {
   id?: string
@@ -239,7 +241,11 @@ export class OrderController implements IOrderController {
         })
       )
     } catch (err) {
-      next(err)
+      if (err instanceof OpenPaymentsClientError && err.status === 401)
+        next(
+          new Unauthorized('Instant-buy is not valid please initiate it again')
+        )
+      else next(err)
     }
   }
 }

packages/wallet/backend/src/user/controller.ts

@@ -1,37 +1,28 @@
 import type { NextFunction, Request } from 'express'
 import type { UserService } from './service'
-import type { User } from './model'
 import { validate } from '@/shared/validate'
 import {
   changePasswordSchema,
   forgotPasswordSchema,
   resetPasswordSchema
 } from '@/user/validation'
 import { Controller, toSuccessResponse, Unauthorized } from '@shared/backend'
-
-interface UserFlags {
-  needsWallet: boolean
-  needsIDProof: boolean
-}
-interface TokenValidity {
-  isValid: boolean
-}
+import { UserResponse } from '@wallet/shared'
+import { ValidTokenResponse } from '@wallet/shared/src'
 
 interface IUserController {
-  me: Controller<UserFlags>
+  me: Controller<UserResponse>
   requestResetPassword: Controller
   resetPassword: Controller
-  checkToken: Controller<TokenValidity>
+  checkToken: Controller<ValidTokenResponse>
 }
 
 export class UserController implements IUserController {
   constructor(private userService: UserService) {}
 
   me = async (
     req: Request,
-    res: CustomResponse<
-      Pick<User, 'email' | 'firstName' | 'lastName' | 'address'> & UserFlags
-    >,
+    res: CustomResponse<UserResponse>,
     next: NextFunction
   ) => {
     try {
@@ -133,7 +124,7 @@ export class UserController implements IUserController {
 
   checkToken = async (
     req: Request,
-    res: CustomResponse<TokenValidity>,
+    res: CustomResponse<ValidTokenResponse>,
     next: NextFunction
   ) => {
     try {

packages/wallet/frontend/src/components/settings/PersonalSettingsForm.tsx

@@ -3,15 +3,16 @@ import { Form } from '@/ui/forms/Form'
 import { useZodForm } from '@/lib/hooks/useZodForm'
 import { Input } from '@/ui/forms/Input'
 import { useEffect, useState } from 'react'
-import { User, profileSchema, userService } from '@/lib/api/user'
+import { profileSchema, userService } from '@/lib/api/user'
 import { useDialog } from '@/lib/hooks/useDialog'
 import { ErrorDialog } from '../dialogs/ErrorDialog'
 import { getObjectKeys } from '@/utils/helpers'
 import { ChangePasswordForm } from './ChangePasswordForm'
 import { usePasswordContext } from '@/lib/context/password'
+import { UserResponse } from '@wallet/shared'
 
 type PersonalSettingsFormProps = {
-  user: User
+  user: UserResponse
 }
 
 export const PersonalSettingsForm = ({ user }: PersonalSettingsFormProps) => {

packages/wallet/frontend/src/lib/api/user.ts

@@ -7,6 +7,7 @@ import {
 } from '../httpClient'
 import { ACCEPTED_IMAGE_TYPES } from '@/utils/constants'
 import { SelectOption } from '@/ui/forms/Select'
+import { UserResponse, ValidTokenResponse } from '@wallet/shared'
 
 export const signUpSchema = z
   .object({
@@ -136,25 +137,12 @@ export const changePasswordSchema = z
     }
   })
 
-export type User = {
-  email: string
-  firstName: string
-  lastName: string
-  address: string
-  needsWallet: boolean
-  needsIDProof: boolean
-}
-
 export type Document = {
   type: string
   name: string
   isBackRequired: boolean
 }
 
-export type ValidToken = {
-  isValid: boolean
-}
-
 type SignUpArgs = z.infer<typeof signUpSchema>
 type SignUpError = ErrorResponse<SignUpArgs | undefined>
 type SignUpResponse = SuccessResponse | SignUpError
@@ -173,14 +161,14 @@ type ResetPasswordArgs = z.infer<typeof resetPasswordSchema>
 type ResetPasswordError = ErrorResponse<ResetPasswordArgs | undefined>
 type ResetPasswordResponse = SuccessResponse | ResetPasswordError
 
-type CheckTokenResult = SuccessResponse<ValidToken>
+type CheckTokenResult = SuccessResponse<ValidTokenResponse>
 type CheckTokenResponse = CheckTokenResult | ErrorResponse
 
 type VerifyEmailArgs = z.infer<typeof verifyEmailSchema>
 type VerifyEmailError = ErrorResponse<VerifyEmailArgs | undefined>
 type VerifyEmailResponse = SuccessResponse | VerifyEmailError
 
-type MeResult = SuccessResponse<User>
+type MeResult = SuccessResponse<UserResponse>
 type MeResponse = MeResult | ErrorResponse
 
 type CreateWalletArgs = z.infer<typeof personalDetailsSchema>

packages/wallet/frontend/src/pages/grants/[grantId].tsx

@@ -57,15 +57,16 @@ const GrantPage: NextPageWithLayout<GrantPageProps> = ({ grant }) => {
       <PageHeader title="Grant details" />
       <div className="flex flex-col items-start md:flex-col">
         <GrantDetails grant={grant}></GrantDetails>
-        {grant.state !== 'FINALIZED' && (
+        {(grant.finalizationReason === 'ISSUED' ||
+          grant.state !== 'FINALIZED') && (
           <Button
             intent="outline"
             aria-label="revoke"
             onClick={() => {
               openDialog(
                 <ConfirmationDialog
                   confirmText="Revoke Grant"
-                  message="Are you sure you want to revoke this grant?"
+                  message="Revoking a grant will prevent future payments from this client. You will need to give the client access again to allow them to initiate further payments. Finalized payments will not change. Are you sure you want to revoke this grant?"
                   onConfirm={() => handleRevokeConfirmation(grant.id)}
                   onClose={closeDialog}
                 />

packages/wallet/frontend/src/pages/request.tsx

@@ -165,7 +165,7 @@ const RequestPage: NextPageWithLayout<RequestProps> = ({ accounts }) => {
           <Badge
             size="fixed"
             text="into"
-            intent="pink"
+            intent="info"
             className="self-start"
           />
           <div className="space-y-4">

packages/wallet/frontend/src/pages/send.tsx

@@ -311,7 +311,7 @@ const SendPage: NextPageWithLayout<SendProps> = ({ accounts }) => {
           }
         }}
       >
-        <Badge size="fixed" text="from" intent="pink" className="self-start" />
+        <Badge size="fixed" text="from" intent="info" className="self-start" />
         <div className="space-y-4">
           <Select
             required
@@ -368,7 +368,7 @@ const SendPage: NextPageWithLayout<SendProps> = ({ accounts }) => {
             )}
           />
         </div>
-        <Badge size="fixed" text="to" intent="pink" className="self-start" />
+        <Badge size="fixed" text="to" intent="info" className="self-start" />
         <div className="space-y-4">
           <Controller
             name="receiver"

packages/wallet/frontend/src/pages/settings/index.tsx

@@ -2,11 +2,12 @@ import { AppLayout } from '@/components/layouts/AppLayout'
 import { PageHeader } from '@/components/PageHeader'
 import { PersonalSettingsForm } from '@/components/settings/PersonalSettingsForm'
 import { SettingsTabs } from '@/components/SettingsTabs'
-import { type User, userService } from '@/lib/api/user'
+import { userService } from '@/lib/api/user'
 import { NextPageWithLayout } from '@/lib/types/app'
 import { GetServerSideProps, InferGetServerSidePropsType } from 'next'
 import { useTheme } from 'next-themes'
 import Image from 'next/image'
+import { UserResponse } from '@wallet/shared'
 
 type AccountSettingsProps = InferGetServerSidePropsType<
   typeof getServerSideProps
@@ -40,7 +41,7 @@ const AccountSettingsPage: NextPageWithLayout<AccountSettingsProps> = ({
 }
 
 export const getServerSideProps: GetServerSideProps<{
-  user: User
+  user: UserResponse
 }> = async (ctx) => {
   const response = await userService.me(ctx.req.headers.cookie)
 

packages/wallet/frontend/src/ui/Badge.tsx

@@ -16,6 +16,9 @@ const badgeStyles = cva(
         ],
         violet: [
           'border-purple-light text-pink-light dark:border-pink-neon dark:text-pink-neon'
+        ],
+        info: [
+          'border-pink-dark text-pink-dark dark:border-teal-neon dark:text-teal-neon'
         ]
       },
       size: {

packages/wallet/shared/src/types/index.ts

@@ -6,3 +6,4 @@ export * from './incomingPayment'
 export * from './transaction'
 export * from './grant'
 export * from './walletAddress'
+export * from './user'

packages/wallet/shared/src/types/user.ts

@@ -0,0 +1,12 @@
+export interface UserResponse {
+  email: string
+  firstName: string
+  lastName: string
+  address: string
+  needsWallet: boolean
+  needsIDProof: boolean
+}
+
+export type ValidTokenResponse = {
+  isValid: boolean
+}