diff --git a/.nx/nxw.js b/.nx/nxw.js deleted file mode 100644 index 2f4503c5a..000000000 --- a/.nx/nxw.js +++ /dev/null @@ -1,115 +0,0 @@ -"use strict"; -// This file should be committed to your repository! It wraps Nx and ensures -// that your local installation matches nx.json. -// See: https://nx.dev/recipes/installation/install-non-javascript for more info. - - - - -Object.defineProperty(exports, "__esModule", { value: true }); -const fs = require('fs'); -const path = require('path'); -const cp = require('child_process'); -const installationPath = path.join(__dirname, 'installation', 'package.json'); -function matchesCurrentNxInstall(currentInstallation, nxJsonInstallation) { - if (!currentInstallation.devDependencies || - !Object.keys(currentInstallation.devDependencies).length) { - return false; - } - try { - if (currentInstallation.devDependencies['nx'] !== - nxJsonInstallation.version || - require(path.join(path.dirname(installationPath), 'node_modules', 'nx', 'package.json')).version !== nxJsonInstallation.version) { - return false; - } - for (const [plugin, desiredVersion] of Object.entries(nxJsonInstallation.plugins || {})) { - if (currentInstallation.devDependencies[plugin] !== desiredVersion) { - return false; - } - } - return true; - } - catch { - return false; - } -} -function ensureDir(p) { - if (!fs.existsSync(p)) { - fs.mkdirSync(p, { recursive: true }); - } -} -function getCurrentInstallation() { - try { - return require(installationPath); - } - catch { - return { - name: 'nx-installation', - version: '0.0.0', - devDependencies: {}, - }; - } -} -function performInstallation(currentInstallation, nxJson) { - fs.writeFileSync(installationPath, JSON.stringify({ - name: 'nx-installation', - devDependencies: { - nx: nxJson.installation.version, - ...nxJson.installation.plugins, - }, - })); - try { - cp.execSync('npm i', { - cwd: path.dirname(installationPath), - stdio: 'inherit', - }); - } - catch (e) { - // revert possible changes to the current installation - fs.writeFileSync(installationPath, JSON.stringify(currentInstallation)); - // rethrow - throw e; - } -} -function ensureUpToDateInstallation() { - const nxJsonPath = path.join(__dirname, '..', 'nx.json'); - let nxJson; - try { - nxJson = require(nxJsonPath); - if (!nxJson.installation) { - console.error('[NX]: The "installation" entry in the "nx.json" file is required when running the nx wrapper. See https://nx.dev/recipes/installation/install-non-javascript'); - process.exit(1); - } - } - catch { - console.error('[NX]: The "nx.json" file is required when running the nx wrapper. See https://nx.dev/recipes/installation/install-non-javascript'); - process.exit(1); - } - try { - ensureDir(path.join(__dirname, 'installation')); - const currentInstallation = getCurrentInstallation(); - if (!matchesCurrentNxInstall(currentInstallation, nxJson.installation)) { - performInstallation(currentInstallation, nxJson); - } - } - catch (e) { - const messageLines = [ - '[NX]: Nx wrapper failed to synchronize installation.', - ]; - if (e instanceof Error) { - messageLines.push(''); - messageLines.push(e.message); - messageLines.push(e.stack); - } - else { - messageLines.push(e.toString()); - } - console.error(messageLines.join('\n')); - process.exit(1); - } -} -if (!process.env.NX_WRAPPER_SKIP_INSTALL) { - ensureUpToDateInstallation(); -} - -require('./installation/node_modules/nx/bin/nx'); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyDroppable.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyDroppable.tsx index f9e7f5a9f..b78b74663 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyDroppable.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableBodyDroppable.tsx @@ -2,7 +2,7 @@ import { Theme } from '@emotion/react'; import { Droppable } from '@hello-pangea/dnd'; import { styled } from '@linaria/react'; import { ReactNode, useContext, useState } from 'react'; -import { ThemeContext } from 'twenty-ui'; +import { MOBILE_VIEWPORT, ThemeContext } from 'twenty-ui'; import { v4 } from 'uuid'; const StyledTbody = styled.tbody<{ @@ -13,16 +13,32 @@ const StyledTbody = styled.tbody<{ position: sticky; left: 0; z-index: 5; + transition: 0.3s ease; } td:nth-of-type(2) { position: sticky; - left: 9px; + left: 11px; z-index: 5; + transition: 0.3s ease; } td:nth-of-type(3) { position: sticky; - left: 39px; + left: 43px; z-index: 5; + transition: 0.3s ease; + + @media (max-width: ${MOBILE_VIEWPORT}px) { + & [data-testid='editable-cell-display-mode'] { + [data-testid='tooltip'] { + display: none; + } + + [data-testid='chip'] { + gap: 0; + } + } + } + &::after { content: ''; position: absolute; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableTd.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableTd.tsx index 5aca062fb..18bd56df7 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableTd.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableTd.tsx @@ -26,6 +26,7 @@ const StyledTd = styled.td<{ hasRightBorder ? borderColor : 'transparent'}; padding: 0; + transition: 0.3s ease; text-align: left; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeader.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeader.tsx index 22da2e8c4..e119469bf 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeader.tsx @@ -26,16 +26,22 @@ const StyledTableHead = styled.thead` position: sticky; left: 0; z-index: 5; + transition: 0.3s ease; } + th:nth-of-type(2) { position: sticky; - left: 9px; + left: 11px; z-index: 5; + transition: 0.3s ease; } + th:nth-of-type(3) { position: sticky; - left: 39px; + left: 43px; z-index: 5; + transition: 0.3s ease; + &::after { content: ''; position: absolute; @@ -46,9 +52,10 @@ const StyledTableHead = styled.thead` box-shadow: ${({ theme }) => theme.boxShadow.light}; clip-path: inset(0px -4px 0px 0px); } + @media (max-width: ${MOBILE_VIEWPORT}px) { - width: 30px; - max-width: 35px; + width: 34px; + max-width: 34px; } } } diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx index f2cc2a0d7..c1e23e687 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx @@ -31,6 +31,7 @@ const StyledColumnHeaderCell = styled.th<{ color: ${({ theme }) => theme.font.color.tertiary}; padding: 0; text-align: left; + transition: 0.3s ease; background-color: ${({ theme }) => theme.background.primary}; border-right: 1px solid ${({ theme }) => theme.border.color.light};