From e3a68d3ecb02a6ca6cb0d470744854046112e3cf Mon Sep 17 00:00:00 2001 From: "Kilu.He" <108015703+qinluhe@users.noreply.github.com> Date: Tue, 27 Aug 2024 10:59:31 +0800 Subject: [PATCH] fix: change icons (#6076) --- .../src/assets/ai_summary.svg | 24 ++++- .../src/assets/ai_translate.svg | 17 +++- .../appflowy_web_app/src/assets/checkbox.svg | 13 ++- .../appflowy_web_app/src/assets/checklist.svg | 13 ++- .../src/assets/created_at.svg | 17 +--- frontend/appflowy_web_app/src/assets/date.svg | 20 ++-- .../src/assets/last_modified.svg | 8 +- .../src/assets/multiselect.svg | 14 +-- .../appflowy_web_app/src/assets/notes.svg | 11 +++ .../appflowy_web_app/src/assets/number.svg | 9 +- .../appflowy_web_app/src/assets/relation.svg | 15 ++- .../src/assets/single_select.svg | 8 +- frontend/appflowy_web_app/src/assets/text.svg | 6 +- frontend/appflowy_web_app/src/assets/url.svg | 9 +- .../components/cell/primary/PrimaryCell.tsx | 12 ++- .../database/components/field/CardField.tsx | 23 +++-- .../grid/grid-column/GridColumn.tsx | 6 +- frontend/appflowy_web_app/vite.config.ts | 96 ++++++++++--------- 18 files changed, 204 insertions(+), 117 deletions(-) create mode 100644 frontend/appflowy_web_app/src/assets/notes.svg diff --git a/frontend/appflowy_web_app/src/assets/ai_summary.svg b/frontend/appflowy_web_app/src/assets/ai_summary.svg index 37c94e5e28..305a960fbc 100644 --- a/frontend/appflowy_web_app/src/assets/ai_summary.svg +++ b/frontend/appflowy_web_app/src/assets/ai_summary.svg @@ -1,4 +1,24 @@ - + + + + + + + + + + + + + + + + + + + + + + diff --git a/frontend/appflowy_web_app/src/assets/ai_translate.svg b/frontend/appflowy_web_app/src/assets/ai_translate.svg index 237fc04194..330536e1d0 100644 --- a/frontend/appflowy_web_app/src/assets/ai_translate.svg +++ b/frontend/appflowy_web_app/src/assets/ai_translate.svg @@ -1,4 +1,17 @@ - + + + + + + + + + + + + diff --git a/frontend/appflowy_web_app/src/assets/checkbox.svg b/frontend/appflowy_web_app/src/assets/checkbox.svg index 37f52c47ed..027a258b64 100644 --- a/frontend/appflowy_web_app/src/assets/checkbox.svg +++ b/frontend/appflowy_web_app/src/assets/checkbox.svg @@ -1,4 +1,9 @@ - - - - + + + + + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/assets/checklist.svg b/frontend/appflowy_web_app/src/assets/checklist.svg index 3a88d236a1..e39d727792 100644 --- a/frontend/appflowy_web_app/src/assets/checklist.svg +++ b/frontend/appflowy_web_app/src/assets/checklist.svg @@ -1,4 +1,9 @@ - - - - + + + + + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/assets/created_at.svg b/frontend/appflowy_web_app/src/assets/created_at.svg index 4469e7f0e3..4897c26504 100644 --- a/frontend/appflowy_web_app/src/assets/created_at.svg +++ b/frontend/appflowy_web_app/src/assets/created_at.svg @@ -1,12 +1,5 @@ - - - - - - - + + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/assets/date.svg b/frontend/appflowy_web_app/src/assets/date.svg index 78243f1e75..a814058d97 100644 --- a/frontend/appflowy_web_app/src/assets/date.svg +++ b/frontend/appflowy_web_app/src/assets/date.svg @@ -1,6 +1,14 @@ - - - - - - + + + + + + + + + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/assets/last_modified.svg b/frontend/appflowy_web_app/src/assets/last_modified.svg index 22861c86e3..293e945ced 100644 --- a/frontend/appflowy_web_app/src/assets/last_modified.svg +++ b/frontend/appflowy_web_app/src/assets/last_modified.svg @@ -1,4 +1,4 @@ - - - + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/assets/multiselect.svg b/frontend/appflowy_web_app/src/assets/multiselect.svg index 97a2e9c434..b5513e4306 100644 --- a/frontend/appflowy_web_app/src/assets/multiselect.svg +++ b/frontend/appflowy_web_app/src/assets/multiselect.svg @@ -1,8 +1,8 @@ - - - - - - - + + + + + + + diff --git a/frontend/appflowy_web_app/src/assets/notes.svg b/frontend/appflowy_web_app/src/assets/notes.svg new file mode 100644 index 0000000000..a6096ef238 --- /dev/null +++ b/frontend/appflowy_web_app/src/assets/notes.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/frontend/appflowy_web_app/src/assets/number.svg b/frontend/appflowy_web_app/src/assets/number.svg index 9d8b98d10d..3320e6fc60 100644 --- a/frontend/appflowy_web_app/src/assets/number.svg +++ b/frontend/appflowy_web_app/src/assets/number.svg @@ -1,3 +1,6 @@ - - - + + + + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/assets/relation.svg b/frontend/appflowy_web_app/src/assets/relation.svg index f82a41d226..48cbae8a68 100644 --- a/frontend/appflowy_web_app/src/assets/relation.svg +++ b/frontend/appflowy_web_app/src/assets/relation.svg @@ -1,8 +1,7 @@ - - - - - - - - + + + + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/assets/single_select.svg b/frontend/appflowy_web_app/src/assets/single_select.svg index 8ccbc9a2e3..f733d9c579 100644 --- a/frontend/appflowy_web_app/src/assets/single_select.svg +++ b/frontend/appflowy_web_app/src/assets/single_select.svg @@ -1,4 +1,6 @@ - - - + + + diff --git a/frontend/appflowy_web_app/src/assets/text.svg b/frontend/appflowy_web_app/src/assets/text.svg index 7befa5080f..7c73a8749f 100644 --- a/frontend/appflowy_web_app/src/assets/text.svg +++ b/frontend/appflowy_web_app/src/assets/text.svg @@ -1,4 +1,4 @@ - - - + + diff --git a/frontend/appflowy_web_app/src/assets/url.svg b/frontend/appflowy_web_app/src/assets/url.svg index f00f5c7aa2..04d42672b9 100644 --- a/frontend/appflowy_web_app/src/assets/url.svg +++ b/frontend/appflowy_web_app/src/assets/url.svg @@ -1,3 +1,6 @@ - - - + + + + \ No newline at end of file diff --git a/frontend/appflowy_web_app/src/components/database/components/cell/primary/PrimaryCell.tsx b/frontend/appflowy_web_app/src/components/database/components/cell/primary/PrimaryCell.tsx index 5837f73b89..e20cb83d0a 100644 --- a/frontend/appflowy_web_app/src/components/database/components/cell/primary/PrimaryCell.tsx +++ b/frontend/appflowy_web_app/src/components/database/components/cell/primary/PrimaryCell.tsx @@ -3,10 +3,14 @@ import { TextCell as CellType, CellProps } from '@/application/database-yjs/cell import { TextCell } from '@/components/database/components/cell/text'; // import { getPlatform } from '@/utils/platform'; import React, { useEffect, useState } from 'react'; +import { ReactComponent as DocumentSvg } from '@/assets/notes.svg'; -export function PrimaryCell(props: CellProps) { - const { rowId } = props; +export function PrimaryCell (props: CellProps & { + showDocumentIcon?: boolean; +}) { + const { rowId, showDocumentIcon } = props; const meta = useRowMetaSelector(rowId); + const hasDocument = meta?.isEmptyDocument === false; const icon = meta?.icon; const [, setHover] = useState(false); @@ -55,7 +59,9 @@ export function PrimaryCell(props: CellProps) { // }} className={'primary-cell relative flex min-h-full w-full items-center gap-2'} > - {icon &&
{icon}
} + {icon ?
{icon}
: hasDocument && showDocumentIcon ? : null}
diff --git a/frontend/appflowy_web_app/src/components/database/components/field/CardField.tsx b/frontend/appflowy_web_app/src/components/database/components/field/CardField.tsx index 85aa3edb9a..911db2d0e5 100644 --- a/frontend/appflowy_web_app/src/components/database/components/field/CardField.tsx +++ b/frontend/appflowy_web_app/src/components/database/components/field/CardField.tsx @@ -1,10 +1,12 @@ import { YjsDatabaseKey } from '@/application/collab.type'; import { FieldType, useCellSelector, useFieldSelector } from '@/application/database-yjs'; +import { TextCell } from '@/application/database-yjs/cell.type'; import Cell from '@/components/database/components/cell/Cell'; +import { PrimaryCell } from '@/components/database/components/cell/primary'; import React, { CSSProperties, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; -export function CardField({ rowId, fieldId }: { rowId: string; fieldId: string; index: number }) { +export function CardField ({ rowId, fieldId }: { rowId: string; fieldId: string; index: number }) { const { t } = useTranslation(); const { field } = useFieldSelector(fieldId); const cell = useCellSelector({ @@ -44,12 +46,19 @@ export function CardField({ rowId, fieldId }: { rowId: string; fieldId: string; return styleProperties; }, [isPrimary, type]); - if (isPrimary && !cell?.data) { - return ( -
- {t('grid.row.titlePlaceholder')} -
- ); + if (isPrimary) { + if (!cell?.data) { + return ( +
+ {t('grid.row.titlePlaceholder')} +
+ ); + } else { + return ; + } + } if (Number(type) === FieldType.Checkbox) { diff --git a/frontend/appflowy_web_app/src/components/database/components/grid/grid-column/GridColumn.tsx b/frontend/appflowy_web_app/src/components/database/components/grid/grid-column/GridColumn.tsx index f4d01f61db..c9883cdbc5 100644 --- a/frontend/appflowy_web_app/src/components/database/components/grid/grid-column/GridColumn.tsx +++ b/frontend/appflowy_web_app/src/components/database/components/grid/grid-column/GridColumn.tsx @@ -6,7 +6,7 @@ import { Tooltip } from '@mui/material'; import React, { useMemo } from 'react'; import { ReactComponent as AIIndicatorSvg } from '@/assets/ai_indicator.svg'; -export function GridColumn({ column, index }: { column: Column; index: number }) { +export function GridColumn ({ column, index }: { column: Column; index: number }) { const { field } = useFieldSelector(column.fieldId); const name = field?.get(YjsDatabaseKey.name); const type = useMemo(() => { @@ -29,8 +29,8 @@ export function GridColumn({ column, index }: { column: Column; index: number }) 'flex h-full w-full items-center gap-1 overflow-hidden whitespace-nowrap border-t border-b border-l border-line-divider px-2 text-sm font-medium hover:bg-fill-list-active' } > -
- +
+
{name}
{isAIField && } diff --git a/frontend/appflowy_web_app/vite.config.ts b/frontend/appflowy_web_app/vite.config.ts index 2448e4abd2..d9f15494f3 100644 --- a/frontend/appflowy_web_app/vite.config.ts +++ b/frontend/appflowy_web_app/vite.config.ts @@ -29,6 +29,15 @@ export default defineConfig({ }, }, }, + { + name: 'prefixIds', + params: { + prefix: (node, { path }) => { + const fileName = path?.split('/').pop()?.split('.')[0]; + return `${fileName}-`; + }, + }, + }, ], }, svgProps: { @@ -36,6 +45,7 @@ export default defineConfig({ }, replaceAttrValues: { '#333': 'currentColor', + 'black': 'currentColor', }, }, }), @@ -58,14 +68,14 @@ export default defineConfig({ }), process.env.ANALYZE_MODE ? visualizer({ - emitFile: true, - }) + emitFile: true, + }) : undefined, process.env.ANALYZE_MODE ? totalBundleSize({ - fileNameRegex: /\.(js|css)$/, - calculateGzip: false, - }) + fileNameRegex: /\.(js|css)$/, + calculateGzip: false, + }) : undefined, ], // Vite options tailored for Tauri development and only applied in `tauri dev` or `tauri build` @@ -86,45 +96,45 @@ export default defineConfig({ }, build: !!process.env.TAURI_PLATFORM ? { - // Tauri supports es2021 - target: process.env.TAURI_PLATFORM === 'windows' ? 'chrome105' : 'safari13', - // don't minify for debug builds - minify: !process.env.TAURI_DEBUG ? 'esbuild' : false, - // produce sourcemaps for debug builds - sourcemap: !!process.env.TAURI_DEBUG, - } + // Tauri supports es2021 + target: process.env.TAURI_PLATFORM === 'windows' ? 'chrome105' : 'safari13', + // don't minify for debug builds + minify: !process.env.TAURI_DEBUG ? 'esbuild' : false, + // produce sourcemaps for debug builds + sourcemap: !!process.env.TAURI_DEBUG, + } : { - target: `esnext`, - reportCompressedSize: true, - sourcemap: isDev, - rollupOptions: !isDev - ? { - output: { - chunkFileNames: 'static/js/[name]-[hash].js', - entryFileNames: 'static/js/[name]-[hash].js', - assetFileNames: 'static/[ext]/[name]-[hash].[ext]', - manualChunks(id) { - if ( - id.includes('/react@') || - id.includes('/react-dom@') || - id.includes('/react-is@') || - id.includes('/yjs@') || - id.includes('/y-indexeddb@') || - id.includes('/dexie') || - id.includes('/redux') || - id.includes('/react-custom-scrollbars') || - id.includes('/dayjs') || - id.includes('/smooth-scroll-into-view-if-needed') || - id.includes('/react-virtualized-auto-sizer') || - id.includes('/react-window') - ) { - return 'common'; - } - }, - }, - } - : {}, - }, + target: `esnext`, + reportCompressedSize: true, + sourcemap: isDev, + rollupOptions: !isDev + ? { + output: { + chunkFileNames: 'static/js/[name]-[hash].js', + entryFileNames: 'static/js/[name]-[hash].js', + assetFileNames: 'static/[ext]/[name]-[hash].[ext]', + manualChunks (id) { + if ( + id.includes('/react@') || + id.includes('/react-dom@') || + id.includes('/react-is@') || + id.includes('/yjs@') || + id.includes('/y-indexeddb@') || + id.includes('/dexie') || + id.includes('/redux') || + id.includes('/react-custom-scrollbars') || + id.includes('/dayjs') || + id.includes('/smooth-scroll-into-view-if-needed') || + id.includes('/react-virtualized-auto-sizer') || + id.includes('/react-window') + ) { + return 'common'; + } + }, + }, + } + : {}, + }, resolve: { alias: [ { find: 'src/', replacement: `${__dirname}/src/` },