@rango-dev/widget-embedded 0.20.1-next.8 → 0.20.1-next.9

package/dist/pages/LiquiditySourcePage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LiquiditySourcePage.d.ts","sourceRoot":"","sources":["../../src/pages/LiquiditySourcePage.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAexC,UAAU,SAAS;IACjB,UAAU,EAAE,WAAW,GAAG,SAAS,CAAC;CACrC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,UAAU,EAAE,EAAE,SAAS,qBAqH5D"}
+{"version":3,"file":"LiquiditySourcePage.d.ts","sourceRoot":"","sources":["../../src/pages/LiquiditySourcePage.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAexC,UAAU,SAAS;IACjB,UAAU,EAAE,WAAW,GAAG,SAAS,CAAC;CACrC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,UAAU,EAAE,EAAE,SAAS,qBAwH5D"}

package/dist/pages/SelectSwapItemsPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectSwapItemsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SelectSwapItemsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAcxC,UAAU,SAAS;IACjB,IAAI,EAAE,QAAQ,GAAG,aAAa,CAAC;CAChC;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,SAAS,qBA+FnD"}
+{"version":3,"file":"SelectSwapItemsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SelectSwapItemsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAcxC,UAAU,SAAS;IACjB,IAAI,EAAE,QAAQ,GAAG,aAAa,CAAC;CAChC;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,SAAS,qBAmGnD"}

package/dist/utils/date.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date.d.ts","sourceRoot":"","sources":["../../src/utils/date.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,2CAA2C,CAAC;AAKzE,eAAO,MAAM,gBAAgB,EAAE,OAmE9B,CAAC"}
+{"version":3,"file":"date.d.ts","sourceRoot":"","sources":["../../src/utils/date.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,2CAA2C,CAAC;AAMzE,eAAO,MAAM,gBAAgB,EAAE,OAmE9B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.20.1-next.8",
+  "version": "0.20.1-next.9",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",
@@ -47,4 +47,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}

package/src/components/ConfirmWalletsModal/ConfirmWalletsModal.tsx

@@ -274,7 +274,7 @@ export function ConfirmWalletsModal(props: PropTypes) {
               type="primary"
               fullWidth
               size="large">
-              Confirm
+              {i18n.t('Confirm')}
             </Button>
           </ConfirmButton>
         ),

package/src/components/HeaderButtons/HeaderButtons.styles.ts

@@ -23,7 +23,10 @@ export const ConnectedIcon = styled('div', {
 export const SuffixContainer = styled('div', {
   display: 'flex',
   justifyContent: 'flex-end',
-  width: '$40',
+  minWidth: '$40',
+  button: {
+    padding: 0,
+  },
 });
 
 export const NotificationsBadgeContainer = styled('div', {

package/src/components/Quote/QuoteSummary.tsx

@@ -1,5 +1,6 @@
 import type { PriceImpactWarningLevel, Step } from '@rango-dev/ui';
 
+import { i18n } from '@lingui/core';
 import { TokenAmount } from '@rango-dev/ui';
 import React from 'react';
 
@@ -21,7 +22,7 @@ export function QuoteSummary(props: PropTypes) {
     <Container>
       <TokenAmount
         direction="horizontal"
-        label="Swap input"
+        label={i18n.t('Swap input')}
         type="input"
         tooltipContainer={getContainer()}
         price={{
@@ -39,8 +40,8 @@ export function QuoteSummary(props: PropTypes) {
       <div className={separatorStyles()} />
       <TokenAmount
         direction="horizontal"
-        label="Estimated output"
         tooltipContainer={getContainer()}
+        label={i18n.t('Estimated output')}
         type="output"
         price={{
           value: to.price.value,

package/src/components/SwapsGroup/SwapsGroup.tsx

@@ -18,11 +18,11 @@ export function SwapsGroup(props: PropTypes) {
 
     const loadingGroups = [
       {
-        title: 'Today',
+        title: i18n.t('Today'),
         swaps,
       },
       {
-        title: 'This month',
+        title: i18n.t('This month'),
         swaps,
       },
     ];
@@ -36,7 +36,7 @@ export function SwapsGroup(props: PropTypes) {
                   variant="label"
                   size="medium"
                   className={groupStyles()}>
-                  {i18n.t(group.title)}
+                  {group.title}
                 </Typography>
               </Time>
               <Divider size={4} />
@@ -69,7 +69,7 @@ export function SwapsGroup(props: PropTypes) {
                   variant="label"
                   size="medium"
                   className={groupStyles()}>
-                  {i18n.t(group.title)}
+                  {group.title}
                 </Typography>
               </Time>
               <Divider size={4} />
@@ -85,8 +85,8 @@ export function SwapsGroup(props: PropTypes) {
                         creationTime={swap.creationTime}
                         status={swap.status}
                         onClick={onSwapClick}
-                        onlyShowTime={group.title === 'Today'}
                         tooltipContainer={getContainer()}
+                        onlyShowTime={group.title === i18n.t('Today')}
                         swapTokenData={{
                           from: {
                             token: {

package/src/pages/LiquiditySourcePage.tsx

@@ -40,6 +40,7 @@ export function LiquiditySourcePage({ sourceType }: PropTypes) {
   const supportedUniqueSwappersGroups: Array<UniqueSwappersGroupType> =
     getUniqueSwappersGroups(swappers, disabledLiquiditySources);
 
+  const types = { Exchanges: i18n.t('Exchanges'), Bridges: i18n.t('Bridges') };
   const validTypes: Array<LiquiditySourceType> = [];
   if (sourceType === 'Exchanges') {
     validTypes.push('DEX');
@@ -103,7 +104,7 @@ export function LiquiditySourcePage({ sourceType }: PropTypes) {
         suffix: (
           <LiquiditySourceSuffix>
             <Button variant="ghost" size="xsmall" onClick={toggleAllSources}>
-              {i18n.t(hasSelectAll ? 'Deselect all' : 'Select all')}
+              {hasSelectAll ? i18n.t('Deselect all') : i18n.t('Select all')}
             </Button>
           </LiquiditySourceSuffix>
         ),
@@ -115,7 +116,9 @@ export function LiquiditySourcePage({ sourceType }: PropTypes) {
           fullWidth
           color="light"
           variant="contained"
-          placeholder={i18n.t('Search {sourceType}', { sourceType })}
+          placeholder={i18n.t('Search {sourceType}', {
+            sourceType: types[sourceType],
+          })}
           onChange={searchHandler}
         />
         {fetchStatus === 'loading' && <LoadingLiquiditySourceList />}

package/src/pages/SelectBlockchainPage.tsx

@@ -2,7 +2,7 @@ import { i18n } from '@lingui/core';
 import {
   Divider,
   getCountCategories,
-  SelectableCategoryList
+  SelectableCategoryList,
 } from '@rango-dev/ui';
 import React, { useState } from 'react';
 
@@ -27,7 +27,7 @@ export function SelectBlockchainPage(props: PropTypes) {
   const fetchStatus = useAppStore().fetchStatus;
 
   const blockchains = useAppStore().blockchains({
-    type: type
+    type,
   });
 
   const countActiveCategories = getCountCategories(blockchains);
@@ -37,7 +37,7 @@ export function SelectBlockchainPage(props: PropTypes) {
   return (
     <Layout
       header={{
-        title: i18n.t(`Select Blockchain`)
+        title: i18n.t(`Select Blockchain`),
       }}>
       <Divider size={12} />
 

package/src/pages/SelectSwapItemsPage.tsx

@@ -68,11 +68,15 @@ export function SelectSwapItemsPage(props: PropTypes) {
       setToToken({ token, meta: { blockchains, tokens } });
     }
   };
+  const types = {
+    source: i18n.t('Source'),
+    destination: i18n.t('Destination'),
+  };
 
   return (
     <Layout
       header={{
-        title: i18n.t('Swap {type}', { type }),
+        title: i18n.t('Swap {type}', { type: types[type] }),
       }}>
       <BlockchainsSection
         blockchains={blockchains}

package/src/utils/date.ts

@@ -1,6 +1,7 @@
 import type { GroupBy } from '../components/SwapsGroup/SwapsGroup.types';
 import type { PendingSwap } from 'rango-types';
 
+import { i18n } from '@lingui/core';
 import dayjs from 'dayjs';
 
 export const groupSwapsByDate: GroupBy = (swaps) => {
@@ -14,28 +15,28 @@ export const groupSwapsByDate: GroupBy = (swaps) => {
     [
       'today',
       {
-        title: 'Today',
+        title: i18n.t('Today'),
         swaps: [],
       },
     ],
     [
       'week',
       {
-        title: 'This week',
+        title: i18n.t('This week'),
         swaps: [],
       },
     ],
     [
       'month',
       {
-        title: 'This month',
+        title: i18n.t('This month'),
         swaps: [],
       },
     ],
     [
       'year',
       {
-        title: 'This year',
+        title: i18n.t('This year'),
         swaps: [],
       },
     ],