merge

.gitignore

@@ -43,7 +43,6 @@ next-env.d.ts
 *storybook.log
 
 # Storybook
-.storybook
 /storybook-static/
 
 # Playwright

.storybook/main.ts

@@ -0,0 +1,57 @@
+import type { StorybookConfig } from '@storybook/nextjs'
+
+const config: StorybookConfig = {
+  stories: [
+    '../src/components/**/*.mdx',
+    '../src/components/**/*.stories.@(js|jsx|mjs|ts|tsx)'
+  ],
+  staticDirs: ['../public'],
+  addons: [
+    '@storybook/addon-onboarding',
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@chromatic-com/storybook',
+    '@storybook/addon-interactions',
+    '@storybook/addon-styling-webpack',
+
+    {
+      name: '@storybook/addon-styling-webpack',
+      options: {
+        rules: [
+          {
+            test: /\.css$/,
+            sideEffects: true,
+            use: [
+              require.resolve('style-loader'),
+              {
+                loader: require.resolve('css-loader'),
+                options: {
+                  importLoaders: 1
+                }
+              },
+              {
+                loader: require.resolve('postcss-loader'),
+                options: {
+                  implementation: require.resolve('postcss')
+                }
+              }
+            ]
+          }
+        ]
+      }
+    }
+  ],
+
+  framework: {
+    name: '@storybook/nextjs',
+    options: {}
+  },
+  typescript: {
+    reactDocgen: 'react-docgen-typescript'
+  },
+  docs: {
+    autodocs: 'tag'
+  },
+  build: {}
+}
+export default config

.storybook/preview.tsx

@@ -0,0 +1,34 @@
+import type { Preview } from '@storybook/react'
+
+import '../src/app/globals.css'
+
+import React from 'react'
+import { ThemeProvider } from '../src/lib/theme/theme-provider'
+import { IntlProvider } from 'react-intl'
+
+const preview: Preview = {
+  parameters: {
+    backgrounds: {
+      values: [{ name: 'Light', value: '#f4f4f5' }],
+      default: 'Light'
+    },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i
+      }
+    }
+  }
+}
+
+export const decorators = [
+  (Story) => (
+    <ThemeProvider>
+      <IntlProvider locale="en">
+        <Story />
+      </IntlProvider>
+    </ThemeProvider>
+  )
+]
+
+export default preview

locales/extracted/en.json

@@ -43,6 +43,7 @@
   "common.noOptions": "No options found.",
   "common.portfolio": "Portfolio",
   "common.previousPage": "Previous page",
+  "common.records": "records",
   "common.remove": "Remove",
   "common.requiredFields": "(*) required fields.",
   "common.resources": "Resources",
@@ -158,7 +159,7 @@
   "ledgers.account.sheet.edit.title": "Edit {accountName}",
   "ledgers.account.sheet.tabs.details": "Account Details",
   "ledgers.accounts.createFirst": "Create first account",
-  "ledgers.accounts.subtitle": "{count} {count, plural, =0 {accounts found} one {acount found} other {accounts found}}",
+  "ledgers.accounts.subtitle": "{count} {count, plural, =0 {accounts found} one {account found} other {accounts found}}",
   "ledgers.accounts.title": "Accounts",
   "ledgers.assets.createButton": "Create your first Asset",
   "ledgers.assets.emptyResource": "You haven't added any Asset within this Ledger yet.",
@@ -199,12 +200,14 @@
   "ledgers.products.sheet.title": "New Product",
   "ledgers.products.subtitle": "Clustering or allocation of customers at different levels.",
   "ledgers.products.title": "Products",
+  "ledgers.sheet.tabs.details": "Ledger Details",
   "ledgers.sheetCreate.description": "Fill in the data of the Ledger you wish to create.",
   "ledgers.sheetCreate.title": "New Ledger",
   "ledgers.subtitle": "Visualize and edit the Ledgers of your Organization.",
+  "ledgers.tab.accounts": "Accounts",
   "ledgers.tab.assets": "Assets",
   "ledgers.tab.overview": "Overview",
-  "ledgers.tab.portfolios-and-accounts": "Portfolios and Accounts",
+  "ledgers.tab.portfolios": "Portfolios",
   "ledgers.tab.products": "Products",
   "ledgers.title": "Ledgers",
   "ledgers.toast.accountCreated": "{accountName} account successfully created",
@@ -249,6 +252,7 @@
   "products.delete.description": "You are about to permanently delete this product. This action cannot be undone. Do you wish to continue?",
   "settings.tab.organizations": "Organizations",
   "settings.tab.otherSettings": "Other Settings",
+  "settings.tab.portfolios": "Portfolios",
   "settings.tab.products": "Products",
   "settings.tabs.organizations": "Organizations",
   "settings.tabs.others": "Others Settings",

locales/extracted/pt.json

@@ -168,7 +168,6 @@
   "ledgers.portfolio.sheet.edit.description": "Visualize e edite os campos do portfólio.",
   "ledgers.portfolio.sheet.edit.title": "Editar {portfolioName}",
   "ledgers.portfolio.sheet.title": "Novo Portfólio",
-  "ledgers.tab.portfolios-and-accounts": "Portfólios e Contas",
   "portfolio.create": "Criar primeiro portfólio",
   "entity.portfolio.description": "Insira o identificador único da entidade associado a este portfólio",
   "entity.portfolio.entityId": "ID da Entidade",
@@ -279,5 +278,10 @@
   "ledgers.assets.sheet.tabs.details": "Detalhes do Ativo",
   "ledgers.portfolio.sheet.tabs.details": "Detalhes do Portfólio",
   "ledgers.products.sheet.tabs.details": "Detalhes do Produto",
-  "notFound.backToHome": "Voltar para Home"
+  "notFound.backToHome": "Voltar para Home",
+  "ledgers.sheet.tabs.details": "Detalhes do Ledger",
+  "common.records": "registros",
+  "ledgers.tab.accounts": "Contas",
+  "ledgers.tab.portfolios": "Portfólios",
+  "settings.tab.portfolios": "Portfólios"
 }

package.json

@@ -7,7 +7,7 @@
     "build": "next build",
     "start": "next start -p 8081",
     "lint": "next lint --fix",
-    "storybook": "storybook dev -p 6006",
+    "storybook": "storybook dev -p 6007",
     "build-storybook": "storybook build",
     "extract:i18n": "tsx ./scripts/i18n-extract.ts",
     "compile:i18n": "formatjs compile-folder \"./locales/extracted\" --format simple \"./locales/compiled\"",

src/app/(auth-routes)/signin/page.tsx

@@ -16,6 +16,7 @@ import { ArrowRight } from 'lucide-react'
 import React from 'react'
 import LoadingScreen from '@/components/loading-screen'
 import MidazLogo from '@/images/midaz-login-screen.png'
+import BackgroundImage from '@/images/login-wallpaper.jpg'
 import {
   Tooltip,
   TooltipContent,
@@ -172,7 +173,13 @@ const SignInPage = () => {
         </div>
       </div>
 
-      <div className="relative flex w-3/6 items-center justify-center bg-login-wallpaper bg-cover">
+      <div className="relative flex w-3/6 items-center justify-center">
+        <Image
+          alt="Login background image"
+          src={BackgroundImage}
+          fill
+          sizes="50vw, 100vh"
+        />
         <div className="absolute inset-0 bg-black bg-opacity-50"></div>
         <div className="relative z-10">
           <Image alt="Midaz Logo" src={MidazLogo} width={150} height={150} />