Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ENG-4662 feat(portal,1ui,graphql): update query in create identity modal #889

Merged
merged 2 commits into from
Nov 6, 2024
Merged

ENG-4662 feat(portal,1ui,graphql): update query in create identity modal #889

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
4d7fc7e
update query in create identity modal plus some fixes
Vitalsine85 Nov 6, 2024
a52c508
fix server/client issue with useCreateConfig hook
Vitalsine85 Nov 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 5 additions & 13 deletions apps/portal/app/components/create-identity/create-identity-form.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, { useEffect, useRef, useState } from 'react'
import React, { useEffect, useState } from 'react'

import {
Badge,
Expand Down Expand Up @@ -28,6 +28,7 @@ import {
import { getZodConstraint, parseWithZod } from '@conform-to/zod'
import { multivaultAbi } from '@lib/abis/multivault'
import { useCreateAtom } from '@lib/hooks/useCreateAtom'
import { useCreateConfig } from '@lib/hooks/useCreateConfig'
import { useGetWalletBalance } from '@lib/hooks/useGetWalletBalance'
import { useImageUploadFetcher } from '@lib/hooks/useImageUploadFetcher'
import {
Expand Down Expand Up @@ -119,17 +120,7 @@ export function IdentityForm({
}
}, [state.status, transactionResponseData])

const loaderFetcher = useFetcher<CreateLoaderData>()
const loaderFetcherUrl = '/resources/create'
const loaderFetcherRef = useRef(loaderFetcher.load)

useEffect(() => {
loaderFetcherRef.current = loaderFetcher.load
})

useEffect(() => {
loaderFetcherRef.current(loaderFetcherUrl)
}, [loaderFetcherUrl])
const { data: configData, isLoading: isLoadingConfig } = useCreateConfig()

useEffect(() => {
logger('file changed', identityImageFile)
Expand Down Expand Up @@ -170,7 +161,7 @@ export function IdentityForm({
}
}, [imageUploadFetcher.data])

const fees = loaderFetcher.data as CreateLoaderData
const fees = configData as CreateLoaderData

const { data: walletClient } = useWalletClient()
const publicClient = usePublicClient()
Expand Down Expand Up @@ -750,6 +741,7 @@ export function IdentityForm({
disabled={
!address ||
loading ||
isLoadingConfig ||
!formTouched ||
['confirm', 'transaction-pending', 'awaiting'].includes(
state.status,
Expand Down
2 changes: 1 addition & 1 deletion apps/portal/app/components/create-identity/create-identity-review.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,7 +118,7 @@ const CreateIdentityReview: React.FC<CreateIdentityReviewProps> = ({
weight="normal"
className="text-neutral-50/50 flex items-center gap-1"
>
Estimated Fees: {totalFees.toFixed(4)} ETH
Estimated Cost: {totalFees.toFixed(4)} ETH
<InfoTooltip
content={
<div className="flex flex-col gap-2">
Expand Down
25 changes: 25 additions & 0 deletions apps/portal/app/lib/hooks/useCreateConfig.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { useQuery } from '@tanstack/react-query'

export type CreateConfigData = {
vaultId: string
atomCost: string
atomCreationFee: string
tripleCost: string
protocolFee: string
entryFee: string
feeDenominator: string
minDeposit: string
}

export function useCreateConfig() {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice. Good idea!

return useQuery<CreateConfigData>({
queryKey: ['create-config'],
queryFn: async () => {
const response = await fetch('/resources/create')
if (!response.ok) {
throw new Error('Failed to fetch create config')
}
return response.json()
},
})
}
7 changes: 6 additions & 1 deletion packages/1ui/src/components/ProfileCard/ProfileCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,12 @@ const ProfileCard = ({
weight="medium"
className="text-primary-300 pt-2.5 whitespace-pre-wrap"
>
<Trunctacular value={bio} maxStringLength={266} />
<Trunctacular
value={bio}
maxStringLength={266}
className="text-left items-start"
disableTooltip
/>
</Text>
</div>
)}
Expand Down
4 changes: 3 additions & 1 deletion packages/1ui/src/components/Trunctacular/Trunctacular.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,9 @@ const Trunctacular = ({
<TooltipTrigger>
<Text {...textProps}>{content}</Text>
</TooltipTrigger>
<TooltipContent>{value}</TooltipContent>
<TooltipContent>
<Text {...textProps}>{value}</Text>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)
Expand Down
1 change: 1 addition & 0 deletions packages/graphql/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@
},
"devDependencies": {
"@0no-co/graphqlsp": "^1.12.16",
"dotenv-cli": "^7.4.1",
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why this dependency? Curious if it was needed for something you ran into

Edit: saw codegen comment. What error? Did you run from the root? Also did you run to add any new queries? Trying to see if this is an issue we can solve without adding this as a dependency- I haven't had issues with codegen but if you saw errors lmk

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more. 

➜  intuition-ts git:(vital/eng-4662-update-queries-in-create-identity-modal) ✗ pnpm run graphql:codegen

> @0xintuition/intuition-ts@ graphql:codegen /home/vital/Git/intuition/intuition-ts
> nx codegen @0xintuition/graphql


> nx run @0xintuition/graphql:codegen


> @0xintuition/[email protected] codegen /home/vital/Git/intuition/intuition-ts/packages/graphql
> dotenv graphql-codegen --config codegen.ts

sh: 1: dotenv: not found
 ELIFECYCLE  Command failed.

———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————

 NX   Ran target codegen for project @0xintuition/graphql (514ms)

   ✖  1/1 failed
   ✔  0/1 succeeded [0 read from cache]

 ELIFECYCLE  Command failed with exit code 1.

This is what I was seeing, added dotenv-cli to devDependencies based on Claudes comments. I think I could have installed it locally and it would have worked. Can remove it though if we need to. I'm assuming you must have it installed on your local machine?

"@graphql-codegen/cli": "^5.0.3",
"@graphql-codegen/client-preset": "^4.4.0",
"@graphql-codegen/introspection": "^4.0.3",
Expand Down
16 changes: 15 additions & 1 deletion pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading