Mirrored_Repos/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-08-30 18:12:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat/add new field functionality done

Browse Source
This commit is contained in:
Mike Abebe 2023-04-05 17:25:07 +03:00
parent db1184ff0d
commit 4f08654fc3
4 changed files with 21 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/appflowy_tauri/src/appflowy_app/components/grid/Grid/Grid.tsx
View File

@ -34,7 +34,7 @@ export const Grid = ({ viewId }: { viewId: string }) => {
{/* table component view with text area for td */}
<div className='flex flex-col gap-4'>
<table className='w-full table-fixed text-sm'>
<GridTableHeader />
<GridTableHeader controller={controller} />
<GridTableRows onOpenRow={onOpenRow} allRows={rows} viewId={viewId} controller={controller} />
</table>

26
frontend/appflowy_tauri/src/appflowy_app/components/grid/GridTableHeader/GridTableHeader.hooks.tsx
View File

@ -1,23 +1,15 @@
import { nanoid } from 'nanoid';
import { FieldType } from '@/services/backend/models/flowy-database/field_entities';
import { gridActions } from '../../../stores/reducers/grid/slice';
import { useAppDispatch, useAppSelector } from '../../../stores/store';
import { useAppSelector } from '../../../stores/store';
import { DatabaseController } from '@/appflowy_app/stores/effects/database/database_controller';
import { TypeOptionController } from '@/appflowy_app/stores/effects/database/field/type_option/type_option_controller';
import { None } from 'ts-results';
export const useGridTableHeaderHooks = function () {
const dispatch = useAppDispatch();
export const useGridTableHeaderHooks = function (controller: DatabaseController) {
const database = useAppSelector((state) => state.database);
const onAddField = () => {
dispatch(
gridActions.addField({
field: {
fieldId: nanoid(8),
name: 'Name',
fieldOptions: {},
fieldType: FieldType.RichText,
},
})
);
const onAddField = async () => {
// TODO: move this to database controller hook
const fieldController = new TypeOptionController(controller.viewId, None);
await fieldController.initialize();
};
return {

12
frontend/appflowy_tauri/src/appflowy_app/components/grid/GridTableHeader/GridTableHeader.tsx
View File

@ -8,15 +8,19 @@ import { MultiSelectTypeSvg } from '../../_shared/svg/MultiSelectTypeSvg';
import { ChecklistTypeSvg } from '../../_shared/svg/ChecklistTypeSvg';
import { UrlTypeSvg } from '../../_shared/svg/UrlTypeSvg';
import { FieldType } from '@/services/backend/models/flowy-database/field_entities';
import { DatabaseController } from '@/appflowy_app/stores/effects/database/database_controller';
import { useTranslation } from 'react-i18next';
export const GridTableHeader = () => {
const { fields, onAddField } = useGridTableHeaderHooks();
export const GridTableHeader = ({ controller }: { controller: DatabaseController }) => {
const { fields, onAddField } = useGridTableHeaderHooks(controller);
const { t } = useTranslation('');
return (
<>
<thead>
<tr>
{fields.map((field, i) => {
{fields.map((field) => {
return (
<th key={field.fieldId} className='m-0 border border-l-0 border-shade-6 p-0'>
<div className={'flex cursor-pointer items-center px-4 py-2 hover:bg-main-secondary'}>
@ -44,7 +48,7 @@ export const GridTableHeader = () => {
<i className='mr-2 h-5 w-5'>
<AddSvg />
</i>
<span>New column</span>
<span>{t('grid.field.newColumn')}</span>
</div>
</th>
</tr>

4
frontend/appflowy_tauri/src/appflowy_app/components/grid/GridTableRows/GridAddRow.tsx
View File

@ -1,8 +1,10 @@
import { DatabaseController } from '@/appflowy_app/stores/effects/database/database_controller';
import AddSvg from '../../_shared/svg/AddSvg';
import { useGridAddRow } from './GridAddRow.hooks';
import { useTranslation } from 'react-i18next';
export const GridAddRow = ({ controller }: { controller: DatabaseController }) => {
const { addRow } = useGridAddRow(controller);
const { t } = useTranslation('');
return (
<div>
@ -10,7 +12,7 @@ export const GridAddRow = ({ controller }: { controller: DatabaseController }) =
<i className='mr-2 h-5 w-5'>
<AddSvg />
</i>
<span>New row</span>
<span>{t('grid.row.newRow')}</span>
</button>
</div>
);