Merge branch 'develop' of github.com:vegaprotocol/frontend-monorepo into feat/lp-sla

apps/trading/client-pages/referrals/apply-code-form.tsx

@@ -81,7 +81,7 @@ export const ApplyCodeForm = () => {
         if (!res) {
           setError('code', {
             type: 'required',
-            message: t('The transaction could not be sent'),
+            message: 'The transaction could not be sent',
           });
         }
         if (res) {
@@ -98,7 +98,7 @@ export const ApplyCodeForm = () => {
             message:
               err instanceof Error
                 ? err.message
-                : t('Your code has been rejected'),
+                : 'Your code has been rejected',
           });
         }
       });
@@ -152,7 +152,7 @@ export const ApplyCodeForm = () => {
           <span className="text-vega-green-500">
             <VegaIcon name={VegaIconNames.TICK} size={20} />
           </span>{' '}
-          <span className="pt-1">{t('Code applied')}</span>
+          <span className="pt-1">Code applied</span>
         </h3>
       </div>
     );
@@ -162,7 +162,7 @@ export const ApplyCodeForm = () => {
     if (!pubKey) {
       return {
         disabled: false,
-        children: t('Connect wallet'),
+        children: 'Connect wallet',
         type: 'button' as ButtonHTMLAttributes<HTMLButtonElement>['type'],
         onClick: ((event) => {
           event.preventDefault();
@@ -174,7 +174,7 @@ export const ApplyCodeForm = () => {
     if (isReadOnly) {
       return {
         disabled: true,
-        children: t('Apply a code'),
+        children: 'Apply a code',
         type: 'submit' as ButtonHTMLAttributes<HTMLButtonElement>['type'],
       };
     }
@@ -182,14 +182,14 @@ export const ApplyCodeForm = () => {
     if (status === 'requested') {
       return {
         disabled: true,
-        children: t('Confirm in wallet...'),
+        children: 'Confirm in wallet...',
         type: 'submit' as ButtonHTMLAttributes<HTMLButtonElement>['type'],
       };
     }
 
     return {
       disabled: false,
-      children: t('Apply a code'),
+      children: 'Apply a code',
       type: 'submit' as ButtonHTMLAttributes<HTMLButtonElement>['type'],
     };
   };
@@ -198,10 +198,10 @@ export const ApplyCodeForm = () => {
     <>
       <div className="w-2/3 max-w-md mx-auto bg-vega-clight-800 dark:bg-vega-cdark-800 p-8 rounded-lg">
         <h3 className="mb-4 text-2xl text-center calt">
-          {t('Apply a referral code')}
+          Apply a referral code
         </h3>
         <p className="mb-4 text-center text-base">
-          {t('Enter a referral code to get trading discounts.')}
+          Enter a referral code to get trading discounts.
         </p>
         <form
           className={classNames('w-full flex flex-col gap-4', {
@@ -210,11 +210,11 @@ export const ApplyCodeForm = () => {
           onSubmit={handleSubmit(onSubmit)}
         >
           <label>
-            <span className="sr-only">{t('Your referral code')}</span>
+            <span className="sr-only">Your referral code</span>
             <Input
               hasError={Boolean(errors.code)}
               {...register('code', {
-                required: t('You have to provide a code to apply it.'),
+                required: 'You have to provide a code to apply it.',
                 validate: validateCode,
               })}
               placeholder="Enter a code"
@@ -236,7 +236,7 @@ export const ApplyCodeForm = () => {
       ) : null}
       {previewData ? (
         <div className="mt-10">
-          <h2 className="text-2xl mb-5">{t('You are joining')}</h2>
+          <h2 className="text-2xl mb-5">You are joining</h2>
           <Statistics data={previewData} as="referee" />
         </div>
       ) : null}

apps/trading/client-pages/referrals/create-code-form.tsx

@@ -24,7 +24,6 @@ import {
   DISCLAIMER_REFERRAL_DOCS_LINK,
 } from './constants';
 import { useReferral } from './hooks/use-referral';
-import { t } from '@vegaprotocol/i18n';
 
 export const CreateCodeContainer = () => {
   return <CreateCodeForm />;
@@ -39,13 +38,10 @@ export const CreateCodeForm = () => {
 
   return (
     <div className="w-2/3 max-w-md mx-auto bg-vega-clight-800 dark:bg-vega-cdark-800 p-8 rounded-lg">
-      <h3 className="mb-4 text-2xl text-center calt">
-        {t('Create a referral code')}
-      </h3>
+      <h3 className="mb-4 text-2xl text-center calt">Create a referral code</h3>
       <p className="mb-4 text-center text-base">
-        {t(
-          'Generate a referral code to share with your friends and start earning commission.'
-        )}
+        Generate a referral code to share with your friends and start earning
+        commission.
       </p>
 
       <div className="w-full flex flex-col">
@@ -60,12 +56,12 @@ export const CreateCodeForm = () => {
             }
           }}
         >
-          {pubKey ? t('Create a referral code') : t('Connect wallet')}
+          {pubKey ? 'Create a referral code' : 'Connect wallet'}
         </RainbowButton>
       </div>
 
       <Dialog
-        title={t('Create a referral code')}
+        title="Create a referral code"
         open={dialogOpen}
         onChange={() => setDialogOpen(false)}
         size="small"
@@ -128,21 +124,21 @@ const CreateCodeDialog = ({
   const getButtonProps = () => {
     if (status === 'idle' || status === 'error') {
       return {
-        children: t('Generate code'),
+        children: 'Generate code',
         onClick: () => onSubmit(),
       };
     }
 
     if (status === 'loading') {
       return {
-        children: t('Confirm in wallet...'),
+        children: 'Confirm in wallet...',
         disabled: true,
       };
     }
 
     if (status === 'success') {
       return {
-        children: t('Close'),
+        children: 'Close',
         intent: Intent.Success,
         onClick: () => {
           refetch();
@@ -155,12 +151,12 @@ const CreateCodeDialog = ({
   if (!pubKey || currentStakeAvailable == null || requiredStake == null) {
     return (
       <div className="flex flex-col gap-4">
-        <p>{t('You must be connected to the Vega wallet.')}</p>
+        <p>You must be connected to the Vega wallet.</p>
         <TradingButton
           intent={Intent.Primary}
           onClick={() => setDialogOpen(false)}
         >
-          {t('Close')}
+          Close
         </TradingButton>
       </div>
     );
@@ -170,18 +166,16 @@ const CreateCodeDialog = ({
     return (
       <div className="flex flex-col gap-4">
         <p>
-          {t('You need at least')}{' '}
-          {addDecimalsFormatNumber(requiredStake.toString(), 18)}{' '}
-          {t(
-            'VEGA staked to generate a referral code and participate in the referral program.'
-          )}
+          You need at least{' '}
+          {addDecimalsFormatNumber(requiredStake.toString(), 18)} VEGA staked to
+          generate a referral code and participate in the referral program.
         </p>
         <TradingAnchorButton
           href={createLink(TokenStaticLinks.ASSOCIATE)}
           intent={Intent.Primary}
           target="_blank"
         >
-          {t('Stake some $VEGA now')}
+          Stake some $VEGA now
         </TradingAnchorButton>
       </div>
     );
@@ -191,9 +185,8 @@ const CreateCodeDialog = ({
     <div className="flex flex-col gap-4">
       {(status === 'idle' || status === 'loading' || status === 'error') && (
         <p>
-          {t(
-            'Generate a referral code to share with your friends and start earning commission.'
-          )}
+          Generate a referral code to share with your friends and start earning
+          commission.
         </p>
       )}
       {status === 'success' && code && (
@@ -208,7 +201,7 @@ const CreateCodeDialog = ({
               className="text-sm no-underline"
               icon={<VegaIcon name={VegaIconNames.COPY} />}
             >
-              <span>{t('Copy')}</span>
+              <span>Copy</span>
             </TradingButton>
           </CopyWithTooltip>
         </div>
@@ -221,10 +214,10 @@ const CreateCodeDialog = ({
       {err && <InputError>{err}</InputError>}
       <div className="flex justify-center pt-5 mt-2 text-sm border-t gap-4 text-default border-default">
         <ExternalLink href={ABOUT_REFERRAL_DOCS_LINK}>
-          {t('About the referral program')}
+          About the referral program
         </ExternalLink>
         <ExternalLink href={DISCLAIMER_REFERRAL_DOCS_LINK}>
-          {t('Disclaimer')}
+          Disclaimer
         </ExternalLink>
       </div>
     </div>

apps/trading/client-pages/referrals/error-boundary.tsx

@@ -3,7 +3,6 @@ import { RainbowButton } from './buttons';
 import { AnimatedDudeWithWire } from './graphics/dude';
 import { LayoutWithSky } from './layout';
 import { Routes } from '../../lib/links';
-import { t } from '@vegaprotocol/i18n';
 
 export const ErrorBoundary = () => {
   const error = useRouteError();
@@ -40,7 +39,7 @@ export const ErrorBoundary = () => {
           variant="border"
           className="text-xs"
         >
-          {t('Go back and try again')}
+          Go back and try again
         </RainbowButton>
       </p>
     </LayoutWithSky>
@@ -61,7 +60,7 @@ export const NotFound = () => {
       <h1 className="text-6xl font-alpha calt mb-10">{'Not found'}</h1>
 
       <p className="text-lg mb-10">
-        {t("The page you're looking for doesn't exists.")}
+        {"The page you're looking for doesn't exists."}
       </p>
 
       <p className="text-lg mb-10">
@@ -70,7 +69,7 @@ export const NotFound = () => {
           variant="border"
           className="text-xs"
         >
-          {t('Go back and try again')}
+          Go back and try again
         </RainbowButton>
       </p>
     </div>

apps/trading/client-pages/referrals/how-it-works-table.tsx

@@ -1,4 +1,3 @@
-import { t } from '@vegaprotocol/i18n';
 import { Table } from './table';
 
 export const HowItWorksTable = () => (
@@ -14,9 +13,7 @@ export const HowItWorksTable = () => (
             1
           </span>
         ),
-        step: t(
-          'Referrers generate a code assigned to their key via an on chain transaction'
-        ),
+        step: 'Referrers generate a code assigned to their key via an on chain transaction',
       },
       {
         number: (
@@ -24,9 +21,7 @@ export const HowItWorksTable = () => (
             2
           </span>
         ),
-        step: t(
-          'Anyone with the referral link can apply it to their key(s) of choice via an on chain transaction'
-        ),
+        step: 'Anyone with the referral link can apply it to their key(s) of choice via an on chain transaction',
       },
       {
         number: (
@@ -34,9 +29,7 @@ export const HowItWorksTable = () => (
             3
           </span>
         ),
-        step: t(
-          'Discounts are applied automatically during trading based on the key(s) used'
-        ),
+        step: 'Discounts are applied automatically during trading based on the key(s) used',
       },
       {
         number: (
@@ -44,9 +37,7 @@ export const HowItWorksTable = () => (
             4
           </span>
         ),
-        step: t(
-          'Referrers earn commission based on a percentage of the taker fees their referees pay'
-        ),
+        step: 'Referrers earn commission based on a percentage of the taker fees their referees pay',
       },
       {
         number: (
@@ -54,9 +45,7 @@ export const HowItWorksTable = () => (
             5
           </span>
         ),
-        step: t(
-          'The commission is taken from the infrastructure fee, maker fee, and liquidity provider fee, not from the referee'
-        ),
+        step: 'The commission is taken from the infrastructure fee, maker fee, and liquidity provider fee, not from the referee',
       },
     ]}
   ></Table>

apps/trading/client-pages/referrals/landing-banner.tsx

@@ -1,6 +1,5 @@
 import classNames from 'classnames';
 import { AnimatedDudeWithWire } from './graphics/dude';
-import { t } from '@vegaprotocol/i18n';
 
 export const LandingBanner = () => {
   return (
@@ -8,18 +7,22 @@ export const LandingBanner = () => {
       <div className="">
         <div
           aria-hidden
-          className="absolute top-20 right-[120px] md:right-[240px] max-sm:hidden"
+          className="absolute top-64 right-[220px] md:right-[340px] max-sm:hidden"
         >
           <AnimatedDudeWithWire />
         </div>
-        <div className="pt-20 sm:w-[50%]">
+        <div className="pt-32 sm:w-[50%]">
           <h1 className="text-6xl font-alpha calt mb-10">
-            {t('Earn commission & stake rewards')}
+            Earn commission & stake rewards
           </h1>
           <p className="text-lg mb-10">
-            {t(
-              'Invite friends and earn rewards from the trading fees they pay. Stake those rewards to earn multipliers on future rewards.'
-            )}
+            Invite friends and earn commission in the form of Vega rewards from
+            the trading fees they pay. Stake those rewards to earn multipliers
+            on future rewards.
+          </p>
+          <p className="text-lg">
+            Any friends that join using the code will receive discounts off
+            trading fees.
           </p>
         </div>
       </div>

apps/trading/client-pages/referrals/layout.tsx

@@ -2,7 +2,6 @@ import classNames from 'classnames';
 import type { HTMLAttributes } from 'react';
 import { SKY_BACKGROUND } from './constants';
 import { Outlet } from 'react-router-dom';
-import { TinyScroll } from '@vegaprotocol/ui-toolkit';
 
 export const Layout = ({
   className,
@@ -29,10 +28,8 @@ export const LayoutWithSky = ({
   ...props
 }: HTMLAttributes<HTMLDivElement>) => {
   return (
-    <TinyScroll
-      className={classNames('max-h-full overflow-auto', SKY_BACKGROUND)}
-    >
+    <div className={classNames('h-full overflow-auto', SKY_BACKGROUND)}>
       <Layout className={className} {...props} />
-    </TinyScroll>
+    </div>
   );
 };

apps/trading/client-pages/referrals/referral-statistics.tsx

@@ -26,7 +26,6 @@ import sortBy from 'lodash/sortBy';
 import { useLayoutEffect, useRef, useState } from 'react';
 import { useCurrentEpochInfoQuery } from './hooks/__generated__/Epoch';
 import BigNumber from 'bignumber.js';
-import { t } from '@vegaprotocol/i18n';
 
 export const ReferralStatistics = () => {
   const { pubKey } = useVegaWallet();
@@ -117,34 +116,34 @@ export const Statistics = ({
     : 0;
 
   const baseCommissionTile = (
-    <StatTile title={t('Base commission rate')}>
+    <StatTile title="Base commission rate">
       {baseCommissionValue * 100}%
     </StatTile>
   );
   const stakingMultiplierTile = (
     <StatTile
-      title={t('Staking multiplier')}
+      title="Staking multiplier"
       description={`(${addDecimalsFormatNumber(
         stakeAvailable?.toString() || 0,
         18
       )} $VEGA staked)`}
     >
-      {multiplier || t('None')}
+      {multiplier || 'None'}
     </StatTile>
   );
   const finalCommissionTile = (
-    <StatTile title={t('Final commission rate')}>
+    <StatTile title="Final commission rate">
       {finalCommissionValue * 100}%
     </StatTile>
   );
   const numberOfTradersValue = data.referees.length;
   const numberOfTradersTile = (
-    <StatTile title={t('Number of traders')}>{numberOfTradersValue}</StatTile>
+    <StatTile title="Number of traders">{numberOfTradersValue}</StatTile>
   );
 
   const codeTile = <CodeTile code={data?.code} />;
   const createdAtTile = (
-    <StatTile title={t('Created at')}>
+    <StatTile title="Created at">
       <span className="text-3xl">
         {getDateFormat().format(new Date(data.createdAt))}
       </span>
@@ -155,10 +154,7 @@ export const Statistics = ({
     .map((r) => new BigNumber(r.totalRefereeGeneratedRewards))
     .reduce((all, r) => all.plus(r), new BigNumber(0));
   const totalCommissionTile = (
-    <StatTile
-      title={t('Total commission (last 30 days)')}
-      description={t('(qUSD)')}
-    >
+    <StatTile title="Total commission (last 30 days)" description="(Quantum)">
       {getNumberFormat(0).format(Number(totalCommissionValue))}
     </StatTile>
   );
@@ -188,31 +184,29 @@ export const Statistics = ({
   });
 
   const currentBenefitTierTile = (
-    <StatTile title={t('Current tier')}>
+    <StatTile title="Current tier">
       {currentBenefitTierValue?.tier || '-'}
     </StatTile>
   );
   const discountFactorTile = (
-    <StatTile title={t('Discount')}>{discountFactorValue * 100}%</StatTile>
+    <StatTile title="Discount">{discountFactorValue * 100}%</StatTile>
   );
   const runningVolumeTile = (
-    <StatTile title={t('Combined volume')}>
+    <StatTile title="Combined volume">
       {compactNumFormat.format(runningVolumeValue)}
     </StatTile>
   );
-  const epochsTile = (
-    <StatTile title={t('Epochs in set')}>{epochsValue}</StatTile>
-  );
+  const epochsTile = <StatTile title="Epochs in set">{epochsValue}</StatTile>;
   const nextTierVolumeTile = (
-    <StatTile title={t('Volume to next tier')}>
+    <StatTile title="Volume to next tier">
       {nextBenefitTierVolumeValue <= 0
-        ? '0'
+        ? '-'
         : compactNumFormat.format(nextBenefitTierVolumeValue)}
     </StatTile>
   );
   const nextTierEpochsTile = (
-    <StatTile title={t('Epochs to next tier')}>
-      {nextBenefitTierEpochsValue <= 0 ? '0' : nextBenefitTierEpochsValue}
+    <StatTile title="Epochs to next tier">
+      {nextBenefitTierEpochsValue <= 0 ? '-' : nextBenefitTierEpochsValue}
     </StatTile>
   );
 
@@ -255,7 +249,7 @@ export const Statistics = ({
       {/* Referees (only for referrer view) */}
       {as === 'referrer' && data.referees.length > 0 && (
         <div className="mt-20 mb-20">
-          <h2 className="text-2xl mb-5">{t('Referees')}</h2>
+          <h2 className="text-2xl mb-5">Referees</h2>
           <div
             className={classNames(
               collapsed && [
@@ -279,12 +273,12 @@ export const Statistics = ({
             <Table
               ref={tableRef}
               columns={[
-                { name: 'party', displayName: t('Trader') },
-                { name: 'joined', displayName: t('Date Joined') },
-                { name: 'volume', displayName: t('Volume (last 30 days)') },
+                { name: 'party', displayName: 'Trader' },
+                { name: 'joined', displayName: 'Date Joined' },
+                { name: 'volume', displayName: 'Volume (last 30 days)' },
                 {
                   name: 'commission',
-                  displayName: t('Commission earned (last 30 days)'),
+                  displayName: 'Commission earned (last 30 days)',
                 },
               ]}
               data={sortBy(

apps/trading/client-pages/referrals/referrals.tsx

@@ -22,9 +22,9 @@ import { t } from '@vegaprotocol/i18n';
 const Nav = () => (
   <div className="flex justify-center border-b border-vega-cdark-500">
     <TabLink end to={Routes.REFERRALS}>
-      {t('I want a code')}
+      I want a code
     </TabLink>
-    <TabLink to={Routes.REFERRALS_APPLY_CODE}>{t('I have a code')}</TabLink>
+    <TabLink to={Routes.REFERRALS_APPLY_CODE}>I have a code</TabLink>
   </div>
 );
 
@@ -77,7 +77,7 @@ export const Referrals = () => {
           </div>
         ) : error ? (
           <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 text-center">
-            <p>{t('Something went wrong')}</p>
+            <p>Something went wrong</p>
             <span className="text-xs">{error.message}</span>
           </div>
         ) : (
@@ -88,7 +88,7 @@ export const Referrals = () => {
       <TiersContainer />
 
       <div className="mt-10 mb-5 text-center">
-        <h2 className="text-2xl">{t('How it works')}</h2>
+        <h2 className="text-2xl">How it works</h2>
       </div>
       <div className="md:w-[60%] mx-auto">
         <HowItWorksTable />
@@ -98,8 +98,7 @@ export const Referrals = () => {
             href={REFERRAL_DOCS_LINK}
             target="_blank"
           >
-            {t('Read the terms')}{' '}
-            <VegaIcon name={VegaIconNames.OPEN_EXTERNAL} />
+            Read the terms <VegaIcon name={VegaIconNames.OPEN_EXTERNAL} />
           </TradingAnchorButton>
         </div>
       </div>

apps/trading/client-pages/referrals/tiers.tsx

@@ -7,7 +7,6 @@ import { Tag } from './tag';
 import type { ComponentProps, ReactNode } from 'react';
 import { ExternalLink } from '@vegaprotocol/ui-toolkit';
 import { DApp, TOKEN_PROPOSALS, useLinks } from '@vegaprotocol/environment';
-import { t } from '@vegaprotocol/i18n';
 
 const Loading = ({ variant }: { variant: 'large' | 'inline' }) => (
   <div
@@ -62,7 +61,7 @@ const StakingTier = ({
         <Tag color={color[tier]}>Multiplier {referralRewardMultiplier}x</Tag>
         <h3 className="mt-1 mb-1 text-base">{label}</h3>
         <p className="text-sm text-vega-clight-100 dark:text-vega-cdark-100">
-          {t('Stake a minimum of')} {minimumStakedTokens} {t('$VEGA tokens')}
+          Stake a minimum of {minimumStakedTokens} $VEGA tokens
         </p>
       </div>
     </div>
@@ -82,12 +81,9 @@ export const TiersContainer = () => {
   if ((!loading && !details) || error) {
     return (
       <div className="text-base px-5 py-10 text-center">
-        {t(
-          "We're sorry but we don't have an active referral programme currently running. You can propose a new programme"
-        )}{' '}
-        <ExternalLink href={governanceLink(TOKEN_PROPOSALS)}>
-          {t('here')}
-        </ExternalLink>
+        We&apos;re sorry but we don&apos;t have an active referral programme
+        currently running. You can propose a new programme{' '}
+        <ExternalLink href={governanceLink(TOKEN_PROPOSALS)}>here</ExternalLink>
         .
       </div>
     );
@@ -97,10 +93,10 @@ export const TiersContainer = () => {
     <>
       {/* Benefit tiers */}
       <div className="flex flex-col items-baseline justify-between mt-10 mb-5">
-        <h2 className="text-2xl">{t('Referral tiers')}</h2>
+        <h2 className="text-2xl">Referral tiers</h2>
         {ends && (
           <span className="text-sm text-vega-clight-200 dark:text-vega-cdark-200">
-            {t('Program ends:')} {ends}
+            Program ends: {ends}
           </span>
         )}
       </div>
@@ -123,7 +119,7 @@ export const TiersContainer = () => {
 
       {/* Staking tiers */}
       <div className="flex flex-row items-baseline justify-between mb-5">
-        <h2 className="text-2xl">{t('Staking multipliers')}</h2>
+        <h2 className="text-2xl">Staking multipliers</h2>
       </div>
       <div className="mb-20 flex flex-col justify-items-stretch lg:flex-row gap-5">
         {loading || !stakingTiers || stakingTiers.length === 0 ? (
@@ -174,15 +170,15 @@ const TiersTable = ({
   return (
     <Table
       columns={[
-        { name: 'tierElement', displayName: t('Tier') },
+        { name: 'tierElement', displayName: 'Tier' },
         {
           name: 'commission',
-          displayName: t('Referrer commission'),
-          tooltip: t('A percentage of commission earned by the referrer'),
+          displayName: 'Referrer commission',
+          tooltip: 'A percentage of commission earned by the referrer',
         },
-        { name: 'discount', displayName: t('Referrer trading discount') },
-        { name: 'volume', displayName: t('Min. trading volume') },
-        { name: 'epochs', displayName: t('Min. epochs') },
+        { name: 'discount', displayName: 'Referrer trading discount' },
+        { name: 'volume', displayName: 'Min. trading volume' },
+        { name: 'epochs', displayName: 'Min. epochs' },
       ]}
       data={data.map((d) => ({
         ...d,

apps/trading/components/layouts/layout-with-sidebar.tsx

@@ -27,7 +27,7 @@ export const LayoutWithSidebar = ({
     <div className={gridClasses}>
       <div className="col-span-full">{header}</div>
       <main
-        className={classNames('col-start-1 col-end-1 overflow-hidden', {
+        className={classNames('col-start-1 col-end-1', {
           'lg:col-end-3': !sidebarOpen,
           'hidden lg:block lg:col-end-2': sidebarOpen,
         })}

apps/trading/pages/client-router.tsx

@@ -55,14 +55,10 @@ export const routerConfig: RouteObject[] = compact([
   FLAGS.REFERRALS
     ? {
         path: AppRoutes.REFERRALS,
-        element: <LayoutWithSidebar sidebar={<PortfolioSidebar />} />,
+        element: <LayoutWithSky />,
         children: [
           {
-            element: (
-              <LayoutWithSky>
-                <Referrals />
-              </LayoutWithSky>
-            ),
+            element: <Referrals />,
             children: [
               {
                 index: true,