[PB-3515]:feat/replace card from ui component

src/components/index.ts

@@ -6,7 +6,6 @@ export { default as BreadcrumbsMenuBackups } from './BreadcrumbsMenuBackups';
 export { default as BreadcrumbsMenuDrive } from './BreadcrumbsMenuDrive';
 export { default as BreadcrumbsMoveItemsDialogView } from './BreadcrumbsMoveItemsDialogView';
 export * from './BreadcrumbsHelper';
-export { default as Card } from './Card';
 export { default as Copyable } from './Copyable';
 export { default as Empty } from './Empty';
 export { default as ExpiredLinkView } from './ExpiredLinkView';

src/views/NewSettings/components/BillingPaymentMethodCard.tsx

@@ -1,6 +1,5 @@
 import { PaymentMethod, UserType } from '@internxt/sdk/dist/drive/payments/types/types';
-import { Button, Loader } from '@internxt/ui';
-import Card from 'components/Card';
+import { Button, Card, Loader } from '@internxt/ui';
 import { t } from 'i18next';
 import { useEffect, useState } from 'react';
 
@@ -33,7 +32,7 @@ const BillingPaymentMethodCard = ({
 
   useEffect(() => {
     (defaultPaymentMethod.tag === 'ready' && defaultPaymentMethod.card) ||
-    (defaultPaymentMethod.tag === 'ready' && defaultPaymentMethod.type)
+      (defaultPaymentMethod.tag === 'ready' && defaultPaymentMethod.type)
       ? setExistsPaymentMethod(true)
       : setExistsPaymentMethod(false);
   }, [defaultPaymentMethod]);

src/views/NewSettings/components/Sections/Account/Account/containers/AccountUsageContainer.tsx

@@ -7,8 +7,7 @@ import errorService from 'services/error.service';
 import navigationService from 'services/navigation.service';
 import usageService, { UsageDetailsProps } from 'app/drive/services/usage.service';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
-import { Button, Loader } from '@internxt/ui';
-import Card from 'components/Card';
+import { Button, Card, Loader } from '@internxt/ui';
 import { PlanState } from 'app/store/slices/plan';
 import { uiActions } from 'app/store/slices/ui';
 import VerticalDivider from '../../../../VerticalDivider';

src/views/NewSettings/components/Sections/Account/Billing/containers/BillingAccountOverview.tsx

@@ -7,9 +7,7 @@ import localStorageService from 'services/local-storage.service';
 import navigationService from 'services/navigation.service';
 import { bytesToString } from 'app/drive/services/size.service';
 
-import Card from 'components/Card';
-
-import { Button } from '@internxt/ui';
+import { Button, Card } from '@internxt/ui';
 import { PlanState } from 'app/store/slices/plan';
 import { getNextBillingDate, getSubscriptionData } from '../../../../../utils';
 

src/views/NewSettings/components/Sections/Account/Security/components/ChangePassword.tsx

@@ -1,10 +1,9 @@
 import { useState } from 'react';
 import { UserSettings } from '@internxt/sdk/dist/shared/types/userSettings';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
-import ChangePasswordModal from './ChangePasswordModal';
+import { Button, Card } from '@internxt/ui';
 import Section from '../../../General/components/Section';
-import Card from 'components/Card';
-import { Button } from '@internxt/ui';
+import ChangePasswordModal from './ChangePasswordModal';
 
 const ChangePassword = ({
   currentPassword,

src/views/NewSettings/components/Sections/Account/Security/components/EnterPassword.tsx

@@ -4,8 +4,7 @@ import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import { areCredentialsCorrect } from 'services/auth.service';
 import errorService from 'services/error.service';
 
-import { Button, Input } from '@internxt/ui';
-import Card from 'components/Card';
+import { Button, Card, Input } from '@internxt/ui';
 
 const EnterPassword = ({
   onUnlock,

src/views/NewSettings/components/Sections/Account/Security/components/ExportBackupKey.tsx

@@ -1,7 +1,6 @@
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import { handleExportBackupKey } from 'utils/backupKeyUtils';
-import { Button } from '@internxt/ui';
-import Card from 'components/Card';
+import { Button, Card } from '@internxt/ui';
 import Section from '../../../General/components/Section';
 
 const ExportBackupKey = (): JSX.Element => {

src/views/NewSettings/components/Sections/Account/Security/components/TwoFactorAuthentication.tsx

@@ -1,9 +1,8 @@
 import { useState, useEffect } from 'react';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import { userHas2FAStored } from 'services/auth.service';
+import { Button, Card, Loader } from '@internxt/ui';
 import Section from '../../../General/components/Section';
-import Card from 'components/Card';
-import { Button, Loader } from '@internxt/ui';
 import TwoFactorAuthenticationEnableModal from './TwoFactorAuthenticationEnableModal';
 import TwoFactorAuthenticationDisableModal from './TwoFactorAuthenticationDisableModal';
 

src/views/NewSettings/components/Sections/General/components/Language.tsx

@@ -4,10 +4,10 @@ import i18next from 'i18next';
 import React, { useEffect } from 'react';
 import localStorageService from 'services/local-storage.service';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
-import Card from 'components/Card';
 import ItemsDropdown from './ItemsDropdown';
 import MenuItem from './MenuItem';
 import Section from './Section';
+import { Card } from '@internxt/ui';
 
 const localStorageLanguage = localStorageService.get('i18nextLng');
 

src/views/NewSettings/components/Sections/Workspace/Billing/BillingDetailsCard.tsx

@@ -1,7 +1,6 @@
 import { t } from 'i18next';
 
-import { Button } from '@internxt/ui';
-import Card from 'components/Card';
+import { Button, Card } from '@internxt/ui';
 import { BillingDetailsCardProps } from '../../../../types/types';
 import Detail from './Detail';
 

src/views/NewSettings/components/Sections/Workspace/Billing/UpdateMembersCard.tsx

@@ -1,6 +1,5 @@
-import { Button, Loader } from '@internxt/ui';
+import { Button, Card, Loader } from '@internxt/ui';
 import { Translate } from 'app/i18n/types';
-import Card from 'components/Card';
 
 interface UpdateMembersCardProps {
   totalWorkspaceSeats: number;

src/views/NewSettings/components/Sections/Workspace/Billing/containers/BillingWorkspaceOverview.tsx

@@ -2,8 +2,7 @@ import { t } from 'i18next';
 
 import localStorageService from 'services/local-storage.service';
 import { bytesToString } from 'app/drive/services/size.service';
-
-import Card from 'components/Card';
+import { Card } from '@internxt/ui';
 
 import { UserType } from '@internxt/sdk/dist/drive/payments/types/types';
 import { PlanState } from 'app/store/slices/plan';

src/views/NewSettings/components/Sections/Workspace/Members/InviteDialog.tsx

@@ -4,8 +4,7 @@ import { UserPlus, X } from '@phosphor-icons/react';
 import { useForm } from 'react-hook-form';
 import { IFormValues } from 'app/core/types';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
-import { Button, Modal, Checkbox, Input } from '@internxt/ui';
-import Card from 'components/Card';
+import { Button, Card, Modal, Checkbox, Input } from '@internxt/ui';
 import TextArea from '../../Account/Account/components/TextArea';
 import UserCard from './components/UserCard';
 

src/views/NewSettings/components/Sections/Workspace/Members/MembersSection.tsx

@@ -7,8 +7,7 @@ import { bytesToString } from 'app/drive/services/size.service';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import UsageBar from '../../../Usage/UsageBar';
 import { getMemberRole, searchMembers } from '../../../../utils';
-import { Button, Input } from '@internxt/ui';
-import Card from 'components/Card';
+import { Button, Card, Input } from '@internxt/ui';
 import { RootState } from 'app/store';
 import { useAppSelector } from 'app/store/hooks';
 import workspacesSelectors from 'app/store/slices/workspaces/workspaces.selectors';
@@ -154,9 +153,8 @@ const MembersSection = ({ onClosePreferences }: { onClosePreferences: () => void
                   return (
                     <button
                       key={id}
-                      className={`flex h-14 flex-row justify-between border-l border-gray-10 px-5 py-2 text-base  font-medium text-gray-100 dark:bg-gray-1 ${
-                        members && i === members.length - 1 ? 'rounded-bl-xl border-b' : ' border-b'
-                      }
+                      className={`flex h-14 flex-row justify-between border-l border-gray-10 px-5 py-2 text-base  font-medium text-gray-100 dark:bg-gray-1 ${members && i === members.length - 1 ? 'rounded-bl-xl border-b' : ' border-b'
+                        }
               ${hoverItemIndex === id ? 'bg-gray-5 dark:bg-gray-5' : 'bg-surface'}`}
                       onMouseEnter={() => setHoverItemIndex(id)}
                       onMouseLeave={() => setHoverItemIndex(null)}
@@ -185,9 +183,8 @@ const MembersSection = ({ onClosePreferences }: { onClosePreferences: () => void
                   return (
                     <button
                       key={id}
-                      className={`flex h-14 items-center justify-between border-gray-10 px-5 py-2 text-base font-normal text-gray-60 dark:bg-gray-1 ${
-                        members && i === members.length - 1 ? 'border-b' : ' border-b'
-                      } ${hoverItemIndex === id ? 'bg-gray-5 dark:bg-gray-5' : 'bg-surface'}`}
+                      className={`flex h-14 items-center justify-between border-gray-10 px-5 py-2 text-base font-normal text-gray-60 dark:bg-gray-1 ${members && i === members.length - 1 ? 'border-b' : ' border-b'
+                        } ${hoverItemIndex === id ? 'bg-gray-5 dark:bg-gray-5' : 'bg-surface'}`}
                       onMouseEnter={() => setHoverItemIndex(id)}
                       onMouseLeave={() => setHoverItemIndex(null)}
                       onClick={() => setSelectedMember(member)}
@@ -220,9 +217,8 @@ const MembersSection = ({ onClosePreferences }: { onClosePreferences: () => void
                   return (
                     <button
                       key={id}
-                      className={`flex h-14 flex-row items-center justify-between border-r border-gray-10 py-2 pl-5 text-base font-normal text-gray-60 dark:bg-gray-1 ${
-                        members && i === members.length - 1 ? 'rounded-br-xl border-b' : 'border-b'
-                      } ${hoverItemIndex === id ? 'bg-gray-5 dark:bg-gray-5' : ''}`}
+                      className={`flex h-14 flex-row items-center justify-between border-r border-gray-10 py-2 pl-5 text-base font-normal text-gray-60 dark:bg-gray-1 ${members && i === members.length - 1 ? 'rounded-br-xl border-b' : 'border-b'
+                        } ${hoverItemIndex === id ? 'bg-gray-5 dark:bg-gray-5' : ''}`}
                       onMouseEnter={() => setHoverItemIndex(id)}
                       onMouseLeave={() => setHoverItemIndex(null)}
                     >

src/views/NewSettings/components/Sections/Workspace/Members/containers/MemberDetailsContainer.tsx

@@ -10,15 +10,14 @@ import { workspaceThunks } from 'app/store/slices/workspaces/workspacesStore';
 import { useEffect, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
-import Card from 'components/Card';
 import { MemberRole } from '../../../../../types/types';
 import DeactivateMemberModal from '../components/DeactivateModal';
 import LeaveMemberModal from '../components/LeaveModal';
 import ReactivateMemberModal from '../components/ReactivateModal';
 import RemoveMemberModal from '../components/RemoveModal';
 import RequestPasswordChangeModal from '../components/RequestPasswordModal';
 import UserCard from '../components/UserCard';
-import { Loader } from '@internxt/ui';
+import { Card, Loader } from '@internxt/ui';
 import { RootState } from 'app/store';
 import { ActionDialog } from 'app/contexts/dialog-manager/ActionDialogManager.context';
 import { useActionDialog } from 'app/contexts/dialog-manager/useActionDialog';

src/views/NewSettings/components/Sections/Workspace/Overview/OverviewSection.tsx

@@ -1,6 +1,6 @@
 import { UserType } from '@internxt/sdk/dist/drive/payments/types/types';
 import { WorkspaceTeam, WorkspaceUser } from '@internxt/sdk/dist/workspaces';
-import { Button, Dropdown, Loader, Modal } from '@internxt/ui';
+import { Button, Card, Dropdown, Loader, Modal } from '@internxt/ui';
 import { PencilSimple } from '@phosphor-icons/react';
 import { t } from 'i18next';
 import { useEffect, useState } from 'react';
@@ -12,7 +12,6 @@ import { UsageDetailsProps } from 'app/drive/services/usage.service';
 import Section from '../../../Section';
 import DetailsInput from '../../../DetailsInput';
 import notificationsService, { ToastType } from 'app/notifications/services/notifications.service';
-import Card from 'components/Card';
 import { RootState } from 'app/store';
 import { useAppDispatch, useAppSelector } from 'app/store/hooks';
 import { PlanState } from 'app/store/slices/plan';

src/views/NewSettings/components/containers/InvoicesContainer.tsx

@@ -1,7 +1,7 @@
 import { Invoice, UserType } from '@internxt/sdk/dist/drive/payments/types/types';
 import { useTranslationContext } from 'app/i18n/provider/TranslationProvider';
 import Section from '../Sections/General/components/Section';
-import Card from 'components/Card';
+import { Card } from '@internxt/ui';
 import InvoicesList from '../../components/Invoices/InvoicesList';
 import { useEffect, useState } from 'react';
 import { paymentService } from 'views/Checkout/services';