Merge branch 'main' into dev

package.json

@@ -2,7 +2,7 @@
   "name": "safe-wallet-web",
   "homepage": "https://github.com/safe-global/safe-wallet-web",
   "license": "GPL-3.0",
-  "version": "1.45.2",
+  "version": "1.45.3",
   "type": "module",
   "scripts": {
     "dev": "next dev",

src/features/targetedOutreach/components/OutreachPopup/index.tsx

@@ -1,3 +1,5 @@
+import { useCreateSubmissionMutation, useGetSubmissionQuery } from '@/store/api/gateway'
+import { skipToken } from '@reduxjs/toolkit/query'
 import { useEffect, type ReactElement } from 'react'
 import { Avatar, Box, Button, Chip, IconButton, Link, Paper, Stack, ThemeProvider, Typography } from '@mui/material'
 import { Close } from '@mui/icons-material'
@@ -14,8 +16,6 @@ import SafeThemeProvider from '@/components/theme/SafeThemeProvider'
 import useChainId from '@/hooks/useChainId'
 import useSafeAddress from '@/hooks/useSafeAddress'
 import useWallet from '@/hooks/wallets/useWallet'
-import { createSubmission } from '@safe-global/safe-client-gateway-sdk'
-import useSubmission from '@/features/targetedOutreach/hooks/useSubmission'
 
 const OutreachPopup = (): ReactElement | null => {
   const dispatch = useAppDispatch()
@@ -24,7 +24,17 @@ const OutreachPopup = (): ReactElement | null => {
   const currentChainId = useChainId()
   const safeAddress = useSafeAddress()
   const wallet = useWallet()
-  const submission = useSubmission()
+  const [createSubmission] = useCreateSubmissionMutation()
+  const { data: submission } = useGetSubmissionQuery(
+    !wallet || !safeAddress
+      ? skipToken
+      : {
+          outreachId: ACTIVE_OUTREACH.id,
+          chainId: currentChainId,
+          safeAddress,
+          signerAddress: wallet?.address,
+        },
+  )
 
   const [askAgainLaterTimestamp, setAskAgainLaterTimestamp] = useSessionStorage<number>(OUTREACH_SS_KEY)
 
@@ -54,10 +64,10 @@ const OutreachPopup = (): ReactElement | null => {
   const handleOpenSurvey = async () => {
     if (wallet) {
       await createSubmission({
-        params: {
-          path: { outreachId: ACTIVE_OUTREACH.id, chainId: currentChainId, safeAddress, signerAddress: wallet.address },
-        },
-        body: { completed: true },
+        outreachId: ACTIVE_OUTREACH.id,
+        chainId: currentChainId,
+        safeAddress,
+        signerAddress: wallet.address,
       })
     }
     dispatch(closeOutreachBanner())
@@ -72,9 +82,9 @@ const OutreachPopup = (): ReactElement | null => {
             <Paper className={css.container}>
               <Stack gap={2}>
                 <Box display="flex">
-                  <Avatar alt="Clem Bihorel" src="/images/common/outreach-popup-avatar.png" />
+                  <Avatar alt="Clem, product lead" src="/images/common/outreach-popup-avatar.png" />
                   <Box ml={1}>
-                    <Typography variant="body2">Clem Bihorel</Typography>
+                    <Typography variant="body2">Clem</Typography>
                     <Typography variant="body2" color="primary.light">
                       Product Lead
                     </Typography>

src/features/targetedOutreach/constants.ts

@@ -1,4 +1,4 @@
-export const ACTIVE_OUTREACH = { id: 1, url: 'https://wn2n6ocviur.typeform.com/to/J1OK3Ikf' }
+export const ACTIVE_OUTREACH = { id: 1, url: 'https://app.opinionx.co/safe-power-user-survey/' }
 
 export const OUTREACH_LS_KEY = 'outreachPopup'
 export const OUTREACH_SS_KEY = 'outreachPopup_session'

src/store/api/gateway/index.ts

@@ -5,7 +5,7 @@ import { asError } from '@/services/exceptions/utils'
 import { getDelegates } from '@safe-global/safe-gateway-typescript-sdk'
 import type { DelegateResponse } from '@safe-global/safe-gateway-typescript-sdk/dist/types/delegates'
 import { safeOverviewEndpoints } from './safeOverviews'
-import { getSubmission } from '@safe-global/safe-client-gateway-sdk'
+import { createSubmission, getSubmission } from '@safe-global/safe-client-gateway-sdk'
 
 async function buildQueryFn<T>(fn: () => Promise<T>) {
   try {
@@ -18,6 +18,7 @@ async function buildQueryFn<T>(fn: () => Promise<T>) {
 export const gatewayApi = createApi({
   reducerPath: 'gatewayApi',
   baseQuery: fakeBaseQuery<Error>(),
+  tagTypes: ['Submissions'],
   endpoints: (builder) => ({
     getTransactionDetails: builder.query<TransactionDetails, { chainId: string; txId: string }>({
       queryFn({ chainId, txId }) {
@@ -43,6 +44,23 @@ export const gatewayApi = createApi({
           getSubmission({ params: { path: { outreachId, chainId, safeAddress, signerAddress } } }),
         )
       },
+      providesTags: ['Submissions'],
+    }),
+    createSubmission: builder.mutation<
+      createSubmission,
+      { outreachId: number; chainId: string; safeAddress: string; signerAddress: string }
+    >({
+      queryFn({ outreachId, chainId, safeAddress, signerAddress }) {
+        return buildQueryFn(() =>
+          createSubmission({
+            params: {
+              path: { outreachId, chainId, safeAddress, signerAddress },
+            },
+            body: { completed: true },
+          }),
+        )
+      },
+      invalidatesTags: ['Submissions'],
     }),
     ...safeOverviewEndpoints(builder),
   }),
@@ -54,6 +72,7 @@ export const {
   useLazyGetTransactionDetailsQuery,
   useGetDelegatesQuery,
   useGetSubmissionQuery,
+  useCreateSubmissionMutation,
   useGetSafeOverviewQuery,
   useGetMultipleSafeOverviewsQuery,
 } = gatewayApi

src/store/api/gateway/safeOverviews.ts

@@ -113,7 +113,7 @@ type MultiOverviewQueryParams = {
   safes: SafeItem[]
 }
 
-export const safeOverviewEndpoints = (builder: EndpointBuilder<any, never, 'gatewayApi'>) => ({
+export const safeOverviewEndpoints = (builder: EndpointBuilder<any, 'Submissions', 'gatewayApi'>) => ({
   getSafeOverview: builder.query<SafeOverview | null, { safeAddress: string; walletAddress?: string; chainId: string }>(
     {
       async queryFn({ safeAddress, walletAddress, chainId }, { getState }) {