@huma-finance/widgets 0.0.59-beta.486 → 0.0.59-beta.488

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@huma-finance/widgets",
-  "version": "0.0.59-beta.486+2521877",
+  "version": "0.0.59-beta.488+0dea268",
   "publishConfig": {
     "access": "public"
   },
@@ -30,8 +30,8 @@
     "@ethersproject/experimental": "^5.7.0",
     "@ethersproject/providers": "^5.6.0",
     "@ethersproject/units": "^5.6.0",
-    "@huma-finance/sdk": "^0.0.58",
-    "@huma-finance/shared": "^0.0.58",
+    "@huma-finance/sdk": "^0.0.59-beta.488+0dea268",
+    "@huma-finance/shared": "^0.0.59-beta.488+0dea268",
     "@mui/icons-material": "^5.3.0",
     "@mui/material": "^5.0.6",
     "@mui/styles": "^5.0.2",
@@ -195,5 +195,5 @@
   "optionalDependencies": {
     "encoding": "^0.1.13"
   },
-  "gitHead": "2521877d3ec21dd5c552804a945184da05dab0e0"
+  "gitHead": "0dea268b16395e79b5c9cbd96cfa66f781360935"
 }

package/src/components/Activity.tsx

@@ -105,13 +105,12 @@ export function Activity({
       margin-top: ${theme.spacing(9)};
     `,
     title: css`
-      font-family: 'Uni-Neue-Black';
+      font-weight: 800;
       font-size: 24px;
-      color: #6b6572;
+      color: ${theme.palette.text.primary};
       margin-bottom: ${theme.spacing(2)};
     `,
     tableWrapper: css`
-      background: #ffffff;
       box-shadow: 0px 4px 40px 8px rgba(0, 0, 0, 0.04);
       border-radius: 24px;
       padding: ${getPadding()};

package/src/components/ApproveAllowanceModal.tsx

@@ -70,9 +70,9 @@ export function ApproveAllowanceModal({
     `,
     description: css`
       margin-top: ${theme.spacing(4)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.secondary};
       padding: ${theme.spacing(0, 1)};
     `,
   }

package/src/components/ApproveAllowanceModalV2.tsx

@@ -66,9 +66,9 @@ export function ApproveAllowanceModalV2({
     `,
     description: css`
       margin-top: ${theme.spacing(4)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.secondary};
       padding: ${theme.spacing(0, 1)};
     `,
   }

package/src/components/ChooseAmountModal.tsx

@@ -60,13 +60,13 @@ export function ChooseAmountModal({
 
   const styles = {
     subTitle: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
     `,
     description2: css`
       ${theme.cssMixins.rowCentered};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.secondary};
       margin-top: ${theme.spacing(2)};
     `,
     chosenAmountWrapper: css`
@@ -80,7 +80,7 @@ export function ChooseAmountModal({
       margin-top: ${theme.spacing(4)};
     `,
     chosenAmount: css`
-      font-family: 'Inter-Bold';
+      font-weight: 700;
       font-size: 32px;
     `,
     chosenAmountSymbol: css`
@@ -134,7 +134,7 @@ export function ChooseAmountModal({
       margin-bottom: ${theme.spacing(7)};
       &.MuiSlider-root {
         height: 8px !important;
-        color: #e9e9e9;
+        color: ${theme.palette.text.primary};
       }
       & .MuiSlider-track {
         height: 8px !important;
@@ -151,19 +151,17 @@ export function ChooseAmountModal({
       }
     `,
     info: css`
-      font-family: 'Uni-Neue-Regular';
-      ${theme.cssMixins.rowSpaceBetweened};
       font-weight: 400;
+      ${theme.cssMixins.rowSpaceBetweened};
       font-size: 16px;
-      color: #423b46;
+      color: ${theme.palette.text.secondary};
     `,
     divider: css`
       margin: ${theme.spacing(2, 0)};
-      background: #49505b;
-      border-color: #e9e3f1;
+      border-color: ${theme.palette.divider};
     `,
     okButton: css`
-      font-family: 'Uni-Neue-Bold';
+      font-weight: 700;
       width: 100%;
       position: absolute;
       bottom: ${theme.spacing(isXsSize ? 2 : 0)};
@@ -172,7 +170,7 @@ export function ChooseAmountModal({
       ${theme.cssMixins.rowHCentered};
       font-weight: 400;
       font-size: 12px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.secondary};
       margin-top: ${theme.spacing(1)};
       letter-spacing: 0px;
       width: 100%;
@@ -189,8 +187,11 @@ export function ChooseAmountModal({
     event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>,
   ) => {
     setInputTouched(true)
-    // @ts-ignore
-    handleChangeAmount(event.target.value)
+    if (!event.target.value) {
+      handleChangeAmount(0)
+    } else {
+      handleChangeAmount(Number(event.target.value))
+    }
   }
 
   const handleSetMax = () => {

package/src/components/ConfirmTransferModal.tsx

@@ -36,9 +36,9 @@ export function ConfirmTransferModal({
       margin-top: ${theme.spacing(-0.5)};
     `,
     description: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #49505b;
+      color: ${theme.palette.text.secondary};
       margin-top: ${theme.spacing(4)};
       text-align: center;
     `,
@@ -46,15 +46,14 @@ export function ConfirmTransferModal({
       margin-top: ${theme.spacing(9)};
     `,
     transfer: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       ${theme.cssMixins.rowSpaceBetweened}
       ${theme.cssMixins.rowVCentered}
       height: 72px;
       background: #f9f8fa;
       border-radius: 4px;
-      font-weight: 500;
       font-size: 16px;
-      color: #49505b;
+      color: ${theme.palette.text.secondary};
       padding: ${theme.spacing(3, 2)};
       margin-bottom: ${theme.spacing(1)};
       position: relative;
@@ -87,7 +86,7 @@ export function ConfirmTransferModal({
       animation-iteration-count: infinite;
       animation-timing-function: linear;
 
-      color: #b246ff;
+      color: ${theme.palette.primary.main};
       position: absolute;
       margin: auto;
       top: 0;

package/src/components/CreditLine/borrow/1-Evaluation.tsx

@@ -67,10 +67,10 @@ export function Evaluation({
     content: css`
       ${theme.cssMixins.rowHCentered};
       margin-top: ${theme.spacing(4)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
       line-height: 24px;
-      color: #49505b;
+      color: ${theme.palette.text.secondary};
       margin-bottom: ${theme.spacing(8)};
     `,
     checkWrapper: css`
@@ -79,9 +79,9 @@ export function Evaluation({
       height: 72px;
       background: #f9f8fa;
       border-radius: 4px;
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #49505b;
+      color: ${theme.palette.text.secondary};
     `,
     checkIcon: css`
       ${theme.cssMixins.rowCentered}
@@ -94,7 +94,7 @@ export function Evaluation({
       }
     `,
     congratsWrapper: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
       padding: ${theme.spacing(0, 2)};
       ${theme.cssMixins.rowVCentered}

package/src/components/ErrorModal.tsx

@@ -55,13 +55,6 @@ export function ErrorModal({
       width: 100%;
       display: inline-table;
       padding: ${theme.spacing(2, 0)};
-      background: linear-gradient(
-          0deg,
-          rgba(255, 255, 255, 0.9),
-          rgba(255, 255, 255, 0.9)
-        ),
-        #d32f2f;
-      border-radius: 4px;
       position: relative;
       margin-top: ${theme.spacing(9)};
       height: 79px;
@@ -69,20 +62,20 @@ export function ErrorModal({
     errorIcon: css`
       position: absolute;
       font-size: 20px;
-      color: #d32f2f;
+      color: ${theme.palette.error.main};
       margin: ${theme.spacing(0, 2)};
     `,
     messageWrapper: css`
-      color: #541313;
-      font-family: 'Uni-Neue-Regular';
+      color: ${theme.palette.text.primary};
+      font-weight: 400;
       font-size: 16px;
       padding-left: ${theme.spacing(6)};
     `,
     errorMessage: css`
       margin-top: ${theme.spacing(0.5)};
       font-size: 14px;
-      font-family: 'Uni-Neue-Regular';
-      color: #541313;
+      font-weight: 400;
+      color: ${theme.palette.text.primary};
       cursor: pointer;
       display: -webkit-box;
       line-height: 16px;

package/src/components/Factoring/FactoredList.tsx

@@ -85,13 +85,13 @@ export function FactoredList<T>({
 
   const styles = {
     title: css`
-      font-family: 'Uni-Neue-Black';
+      font-weight: 800;
       color: ${theme.palette.text.primary};
       font-size: 24px;
       margin-bottom: ${theme.spacing(2)};
     `,
     description: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       color: ${theme.palette.text.primary};
       font-size: 1rem;
     `,

package/src/components/Factoring/UpcomingList.tsx

@@ -37,13 +37,13 @@ export function UpcomingList<T>({
 
   const styles = {
     title: css`
-      font-family: 'Uni-Neue-Black';
+      font-weight: 800;
       color: ${theme.palette.text.primary};
       font-size: 24px;
       margin-bottom: ${theme.spacing(2)};
     `,
     description: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       color: ${theme.palette.text.primary};
       font-size: 1rem;
     `,

package/src/components/HumaSnackBar.tsx

@@ -33,11 +33,11 @@ export function HumaSnackBar({
     title: css`
       margin-bottom: ${theme.spacing(1)};
       font-size: 16px;
-      font-family: 'Uni-Neue-Bold';
+      font-weight: 700;
     `,
     message: css`
       font-size: 15px;
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
     `,
   }
 

package/src/components/HumaTable.tsx

@@ -35,13 +35,13 @@ export function HumaTable<T>({
 
   const styles = {
     tableHeader: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       ${theme.cssMixins.rowVCentered}
       font-size: 14px;
       color: rgba(0, 0, 0, 0.87);
     `,
     tableBody: css`
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 14px;
       color: rgba(0, 0, 0, 0.87);
     `,
@@ -50,7 +50,7 @@ export function HumaTable<T>({
       flex-direction: column;
       align-items: center;
       margin-top: ${theme.spacing(2)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 14px;
     `,
   }

package/src/components/InputAmountModal.tsx

@@ -50,7 +50,7 @@ export function InputAmountModal({
       input {
         width: 100%;
         color: ${theme.palette.text.primary};
-        font-family: 'Uni-Neue-Black';
+        font-weight: 800;
         font-size: 40px;
         line-height: 133.4%;
       }
@@ -63,7 +63,7 @@ export function InputAmountModal({
     maxTitle: css`
       position: absolute;
       color: ${theme.palette.text.primary};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 12px;
       line-height: 166%;
       letter-spacing: 0.4px;
@@ -77,18 +77,16 @@ export function InputAmountModal({
       justify-content: center;
       align-items: center;
       border-radius: 32px;
-      background: #f7f1ff;
       padding: 4px 10px;
       gap: 8px;
-      color: #b246ff;
-      font-family: 'Uni-Neue-Bold';
+      font-weight: 700;
       font-size: 13px;
       line-height: 22px;
       letter-spacing: 0.46px;
     `,
     info: css`
       color: ${theme.palette.text.primary};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
       line-height: 160%;
       letter-spacing: 0.15px;
@@ -133,7 +131,11 @@ export function InputAmountModal({
                   </Button>
                 </Box>
               ) : (
-                <Button css={styles.max} onClick={setMaxAmount}>
+                <Button
+                  variant='contained'
+                  css={styles.max}
+                  onClick={setMaxAmount}
+                >
                   {maxAmountText}
                 </Button>
               ),

package/src/components/Lend/addRedemptionV2/1-ChooseTranche.tsx

@@ -31,7 +31,7 @@ export function ChooseTranche({
   const styles = {
     subTitle: css`
       color: ${theme.palette.text.primary} !important;
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
       line-height: 150%;
       letter-spacing: 0.15px;
@@ -47,7 +47,7 @@ export function ChooseTranche({
 
       .MuiFormControlLabel-label {
         color: ${theme.palette.text.primary};
-        font-family: 'Uni-Neue-Regular';
+        font-weight: 400;
         font-size: 16px;
         line-height: 150%;
         letter-spacing: 0.15px;

package/src/components/Lend/supply/1-Evaluation/EvaluationEA.tsx

@@ -38,9 +38,9 @@ export function EvaluationEA({
       ${theme.cssMixins.rowCentered};
       margin-top: ${theme.spacing(10)};
       padding: ${theme.spacing(0, 2)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.secondary};
     `,
   }
 

package/src/components/Lend/supply/1-Evaluation/EvaluationKYC.tsx

@@ -115,9 +115,9 @@ export function EvaluationKYC({
       ${theme.cssMixins.rowCentered};
       margin-top: ${theme.spacing(10)};
       padding: ${theme.spacing(0, 2)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.secondary};
     `,
   }
 

package/src/components/Lend/supplyV2/1-ChooseTranche.tsx

@@ -33,7 +33,7 @@ export function ChooseTranche({
   const styles = {
     subTitle: css`
       color: ${theme.palette.text.primary} !important;
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
       line-height: 150%;
       letter-spacing: 0.15px;
@@ -49,7 +49,7 @@ export function ChooseTranche({
 
       .MuiFormControlLabel-label {
         color: ${theme.palette.text.primary};
-        font-family: 'Uni-Neue-Regular';
+        font-weight: 400;
         font-size: 16px;
         line-height: 150%;
         letter-spacing: 0.15px;

package/src/components/Lend/supplyV2/3-ChooseAmount.tsx

@@ -1,5 +1,6 @@
 import {
   CampaignService,
+  checkIsDev,
   formatNumber,
   PoolInfoV2,
   TrancheType,
@@ -33,6 +34,7 @@ export function ChooseAmount({
   isUniTranche,
   campaign,
 }: Props): React.ReactElement | null {
+  const isDev = checkIsDev()
   const dispatch = useAppDispatch()
   const { account, provider } = useWeb3React()
   const { symbol, decimals } = poolUnderlyingToken
@@ -66,6 +68,7 @@ export function ChooseAmount({
               poolInfo.poolUnderlyingToken.decimals,
             )
             .toString(),
+          isDev,
         )
         const campaignPoints = estimatedPoints.find(
           (item) => item.campaignId === campaign.id,
@@ -81,6 +84,7 @@ export function ChooseAmount({
     campaign,
     debouncedValue,
     decimals,
+    isDev,
     poolInfo.poolUnderlyingToken.decimals,
     selectedTranche,
   ])

package/src/components/Lend/supplyV2/8-PointsEarned.tsx

@@ -36,6 +36,7 @@ export function PointsEarned({
   handleAction,
 }: Props): React.ReactElement {
   const theme = useTheme()
+  const isDev = checkIsDev()
   const dispatch = useDispatch()
   const { account, chainId } = useWeb3React()
   const [pointsAccumulated, setPointsAccumulated] = useState<
@@ -50,7 +51,7 @@ export function PointsEarned({
     setError: setAuthError,
     isWalletOwnershipVerified,
     isWalletOwnershipVerificationRequired,
-  } = useAuthErrorHandling(checkIsDev())
+  } = useAuthErrorHandling(isDev)
   const [walletOwnership, setWalletOwnership] = useState<boolean | undefined>()
   const [state, setState] = useState<STATE>(STATE.Loading)
 
@@ -68,14 +69,17 @@ export function PointsEarned({
 
   useEffect(() => {
     const checkWalletOwnership = async () => {
-      const ownership = await CampaignService.checkWalletOwnership(account!)
+      const ownership = await CampaignService.checkWalletOwnership(
+        account!,
+        isDev,
+      )
       setWalletOwnership(ownership)
       if (!ownership) {
         setAuthError('WalletNotSignInException')
       }
     }
     checkWalletOwnership()
-  }, [account, setAuthError])
+  }, [account, isDev, setAuthError])
 
   useEffect(() => {
     if (errorType === 'NotSignedIn') {
@@ -103,6 +107,7 @@ export function PointsEarned({
             chainId!,
             account!,
             transactionHash,
+            isDev,
           )
           if (!result.pointsAccumulated) {
             dispatch(
@@ -123,7 +128,7 @@ export function PointsEarned({
       }
     }
     updateWalletPoints()
-  }, [account, chainId, dispatch, transactionHash, walletOwnership])
+  }, [account, chainId, dispatch, isDev, transactionHash, walletOwnership])
 
   const styles = {
     wrapper: css`
@@ -136,9 +141,9 @@ export function PointsEarned({
     ribbon: css`
       position: relative;
       ${theme.cssMixins.rowHCentered};
-      font-family: 'Uni-Neue-Bold';
+      font-weight: 700;
       margin-top: ${theme.spacing(-8)};
-      color: #fbfbfc;
+      color: ${theme.palette.text.primary};
       font-size: 20px;
       line-height: 160%;
       letter-spacing: 0.15px;
@@ -155,7 +160,7 @@ export function PointsEarned({
     entirePoints: css`
       color: ${theme.palette.text.tertiary};
       text-align: center;
-      font-family: 'Uni-Neue-Bold';
+      font-weight: 700;
       font-size: 20px;
       line-height: 160%;
       letter-spacing: 0.15px;
@@ -164,14 +169,14 @@ export function PointsEarned({
     entirePointsDetails: css`
       color: ${theme.palette.text.tertiary};
       text-align: center;
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
       line-height: 150%;
       letter-spacing: 0.15px;
       margin-top: ${theme.spacing(4)};
     `,
     everyday: css`
-      font-family: 'Uni-Neue-Bold';
+      font-weight: 700;
     `,
   }
 

package/src/components/Lend/supplyV2/components/PersonaEvaluation.tsx

@@ -90,11 +90,12 @@ export function PersonaEvaluation({
         await CampaignService.createNewWallet(
           account,
           localStorage.getItem(CAMPAIGN_REFERENCE_CODE) ?? undefined,
+          isDev,
         )
       }
     }
     createNewWallet()
-  }, [account, campaign, isWalletOwnershipVerified])
+  }, [account, campaign, isDev, isWalletOwnershipVerified])
 
   useEffect(() => {
     const getBasePoints = async () => {
@@ -102,6 +103,7 @@ export function PersonaEvaluation({
         const estimatedPoints = await CampaignService.getEstimatedPoints(
           campaign.campaignGroupId,
           minDepositAmountBN.toString(),
+          isDev,
         )
         const campaignPoints = estimatedPoints.find(
           (item) => item.campaignId === campaign.id,
@@ -121,7 +123,7 @@ export function PersonaEvaluation({
       }
     }
     getBasePoints()
-  }, [campaign, isUniTranche, minDepositAmountBN])
+  }, [campaign, isDev, isUniTranche, minDepositAmountBN])
 
   const approveLender = useCallback(async () => {
     try {
@@ -378,13 +380,13 @@ export function PersonaEvaluation({
       text-align: justify;
       margin-top: ${theme.spacing(10)};
       padding: ${theme.spacing(0, 2)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.primary};
     `,
     points: css`
-      color: #b246ff;
-      font-family: 'Uni-Neue-Bold';
+      color: ${theme.palette.primary.main};
+      font-weight: 700;
     `,
   }
 

package/src/components/Lend/supplyV2/components/SecuritizeEvaluation.tsx

@@ -313,9 +313,9 @@ export function SecuritizeEvaluation({
       ${theme.cssMixins.rowCentered};
       margin-top: ${theme.spacing(10)};
       padding: ${theme.spacing(0, 2)};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.primary};
     `,
   }
 

package/src/components/Lend/withdrawV2/1-ConfirmTransfer.tsx

@@ -80,7 +80,7 @@ export function ConfirmTransfer({
     itemWrapper: css`
       margin-top: ${theme.spacing(9)};
       color: ${theme.palette.text.primary};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
       line-height: 175%;
       letter-spacing: 0.15px;
@@ -93,10 +93,10 @@ export function ConfirmTransfer({
     `,
     itemValue: css`
       font-size: 20px;
-      font-family: 'Uni-Neue-Bold';
+      font-weight: 700;
     `,
     divider: css`
-      border-color: #eae6f0;
+      border-color: ${theme.palette.divider};
       margin-bottom: ${theme.spacing(3)};
     `,
   }

package/src/components/Notifi/NotifiSubscriptionModal.tsx

@@ -158,9 +158,9 @@ export function NotifiSubscriptionModal({
   const styles = {
     disclaimer: css`
       ${theme.cssMixins.rowCentered};
-      font-family: 'Uni-Neue-Regular';
+      font-weight: 400;
       font-size: 16px;
-      color: #a8a1b2;
+      color: ${theme.palette.text.secondary};
       margin-top: ${theme.spacing(6)};
     `,
     inputField: css`