8538004962

Committed 03 Apr 2024 11:36AM CUT coverage: 18.233% (-3.3%) from 21.535%

Build # 8538004962

Build Type

Pull #528

github

Committed by

web-flow

Commit Message

Merge c1a248a6f into 45ee7ebb3

Pull Request Pull Request #528: feat: Kanban view

Run Details

575 of 1136 branches covered (50.62%)

29 of 2908 new or added lines in 83 files covered. (1.0%)

5 existing lines in 5 files now uncovered.

6439 of 35315 relevant lines covered (18.23%)

3.94 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/packages/sdk/src/components/cell-value-editor/CellEditorMain.tsx

import type {
  IAttachmentCellValue,
  ICheckboxCellValue,
  IDateFieldOptions,
  ILinkCellValue,
  ILinkFieldOptions,
  ILongTextCellValue,
  IMultipleSelectCellValue,
  INumberCellValue,
  INumberFieldOptions,
  IRatingFieldOptions,
  ISelectFieldChoice,
  ISelectFieldOptions,
  ISingleLineTextCellValue,
  ISingleLineTextFieldOptions,
  ISingleSelectCellValue,
  IUserCellValue,
  IUserFieldOptions,
} from '@teable/core';
import { ColorUtils, FieldType } from '@teable/core';
import { useCallback, useEffect, useRef } from 'react';
import { useTableId } from '../../hooks';
import { Field } from '../../model';
import { transformSelectOptions } from '../cell-value';
import {
  AttachmentEditor,
  CheckboxEditor,
  DateEditor,
  NumberEditor,
  SelectEditor,
  TextEditor,
  RatingEditor,
  LongTextEditor,
  LinkEditor,
  UserEditor,
} from '../editor';
import type { IEditorRef } from '../editor/type';
import type { ICellValueEditor } from './type';

export const CellEditorMain = (props: Omit<ICellValueEditor, 'wrapClassName' | 'wrapStyle'>) => {
  const { field, recordId, cellValue, onChange, readonly, className } = props;
  const tableId = useTableId();
  const { id: fieldId, type, options } = field;
  const editorRef = useRef<IEditorRef<unknown>>(null);

  useEffect(() => {
    editorRef?.current?.setValue?.(cellValue);
  }, [cellValue]);

  const onOptionAdd = useCallback(
    async (name: string) => {
      if (!tableId) return;
      if (type !== FieldType.SingleSelect && type !== FieldType.MultipleSelect) return;

      const { choices = [] } = options as ISelectFieldOptions;
      const existColors = choices.map((v) => v.color);
      const choice = {
        name,
        color: ColorUtils.randomColor(existColors)[0],
      } as ISelectFieldChoice;

      const newChoices = [...choices, choice];

      await Field.convertField(tableId, fieldId, {
        type,
        options: { ...options, choices: newChoices },
      });
    },
    [tableId, type, fieldId, options]
  );

  switch (type) {
    case FieldType.SingleLineText: {
      return (
        <TextEditor
          ref={editorRef}
          className={className}
          value={cellValue as ISingleLineTextCellValue}
          options={options as ISingleLineTextFieldOptions}
          onChange={onChange}
          readonly={readonly}
        />
      );
    }
    case FieldType.LongText: {
      return (
        <LongTextEditor
          ref={editorRef}
          className={className}
          value={cellValue as ILongTextCellValue}
          onChange={onChange}
          readonly={readonly}
        />
      );
    }
    case FieldType.Number: {
      return (
        <NumberEditor
          ref={editorRef}
          className={className}
          options={options as INumberFieldOptions}
          value={cellValue as INumberCellValue}
          onChange={onChange}
          readonly={readonly}
        />
      );
    }
    case FieldType.Rating: {
      return (
        <RatingEditor
          className={className}
          options={options as IRatingFieldOptions}
          value={cellValue as INumberCellValue}
          onChange={onChange}
          readonly={readonly}
        />
      );
    }
    case FieldType.SingleSelect: {
      return (
        <SelectEditor
          ref={editorRef}
          className={className}
          value={cellValue as ISingleSelectCellValue}
          options={transformSelectOptions(options as ISelectFieldOptions)}
          onChange={onChange}
          readonly={readonly}
          onOptionAdd={onOptionAdd}
        />
      );
    }
    case FieldType.MultipleSelect: {
      return (
        <SelectEditor
          ref={editorRef}
          className={className}
          value={cellValue as IMultipleSelectCellValue}
          options={transformSelectOptions(options as ISelectFieldOptions)}
          onChange={onChange}
          isMultiple
          readonly={readonly}
          onOptionAdd={onOptionAdd}
        />
      );
    }
    case FieldType.Checkbox: {
      return (
        // Setting the checkbox size is affected by the font-size causing the height to change.
        <div style={{ fontSize: 0 }}>
          <CheckboxEditor
            className={className}
            value={cellValue as ICheckboxCellValue}
            onChange={onChange}
            readonly={readonly}
          />
        </div>
      );
    }
    case FieldType.Date: {
      return (
        <DateEditor
          ref={editorRef}
          className={className}
          options={options as IDateFieldOptions}
          value={cellValue as string}
          onChange={(selectedDay) => onChange?.(selectedDay ?? null)}
          readonly={readonly}
        />
      );
    }
    case FieldType.Attachment: {
      return (
        <AttachmentEditor
          className={className}
          value={cellValue as IAttachmentCellValue}
          onChange={onChange}
          readonly={readonly}
        />
      );
    }
    case FieldType.Link: {
      return (
        <LinkEditor
          className={className}
          cellValue={cellValue as ILinkCellValue | ILinkCellValue[]}
          options={options as ILinkFieldOptions}
          onChange={onChange}
          readonly={readonly}
          fieldId={field.id}
          recordId={recordId}
        />
      );
    }
    case FieldType.User: {
      return (
        <UserEditor
          className={className}
          value={cellValue as IUserCellValue | IUserCellValue[]}
          options={options as IUserFieldOptions}
          onChange={onChange}
          readonly={readonly}
        />
      );
    }
    default:
      throw new Error(`The field type (${type}) is not implemented editor`);
  }
};

1	import type {	×
2	IAttachmentCellValue,	×
3	ICheckboxCellValue,	×
4	IDateFieldOptions,	×
5	ILinkCellValue,	×
6	ILinkFieldOptions,	×
7	ILongTextCellValue,	×
8	IMultipleSelectCellValue,	×
9	INumberCellValue,	×
10	INumberFieldOptions,	×
11	IRatingFieldOptions,	×
12	ISelectFieldChoice,	×
13	ISelectFieldOptions,	×
14	ISingleLineTextCellValue,	×
15	ISingleLineTextFieldOptions,	×
16	ISingleSelectCellValue,	×
17	IUserCellValue,	×
18	IUserFieldOptions,	×
19	} from '@teable/core';	×
20	import { ColorUtils, FieldType } from '@teable/core';	×
21	import { useCallback, useEffect, useRef } from 'react';	×
22	import { useTableId } from '../../hooks';	×
23	import { Field } from '../../model';	×
NEW 24	import { transformSelectOptions } from '../cell-value';	×
25	import {	×
26	AttachmentEditor,	×
27	CheckboxEditor,	×
28	DateEditor,	×
29	NumberEditor,	×
30	SelectEditor,	×
31	TextEditor,	×
32	RatingEditor,	×
33	LongTextEditor,	×
34	LinkEditor,	×
35	UserEditor,	×
36	} from '../editor';	×
37	import type { IEditorRef } from '../editor/type';	×
38	import type { ICellValueEditor } from './type';	×
39		×
40	export const CellEditorMain = (props: Omit<ICellValueEditor, 'wrapClassName' \| 'wrapStyle'>) => {	×
41	const { field, recordId, cellValue, onChange, readonly, className } = props;	×
42	const tableId = useTableId();	×
43	const { id: fieldId, type, options } = field;	×
44	const editorRef = useRef<IEditorRef<unknown>>(null);	×
45		×
46	useEffect(() => {	×
47	editorRef?.current?.setValue?.(cellValue);	×
48	}, [cellValue]);	×
49		×
50	const onOptionAdd = useCallback(	×
51	async (name: string) => {	×
52	if (!tableId) return;	×
53	if (type !== FieldType.SingleSelect && type !== FieldType.MultipleSelect) return;	×
54		×
55	const { choices = [] } = options as ISelectFieldOptions;	×
56	const existColors = choices.map((v) => v.color);	×
57	const choice = {	×
58	name,	×
59	color: ColorUtils.randomColor(existColors)[0],	×
60	} as ISelectFieldChoice;	×
61		×
62	const newChoices = [...choices, choice];	×
63		×
64	await Field.convertField(tableId, fieldId, {	×
65	type,	×
66	options: { ...options, choices: newChoices },	×
67	});	×
68	},	×
69	[tableId, type, fieldId, options]	×
70	);	×
71		×
72	switch (type) {	×
73	case FieldType.SingleLineText: {	×
74	return (	×
75	<TextEditor	×
76	ref={editorRef}	×
77	className={className}	×
78	value={cellValue as ISingleLineTextCellValue}	×
79	options={options as ISingleLineTextFieldOptions}	×
80	onChange={onChange}	×
81	readonly={readonly}	×
82	/>	×
83	);	×
84	}	×
85	case FieldType.LongText: {	×
86	return (	×
87	<LongTextEditor	×
88	ref={editorRef}	×
89	className={className}	×
90	value={cellValue as ILongTextCellValue}	×
91	onChange={onChange}	×
92	readonly={readonly}	×
93	/>	×
94	);	×
95	}	×
96	case FieldType.Number: {	×
97	return (	×
98	<NumberEditor	×
99	ref={editorRef}	×
100	className={className}	×
101	options={options as INumberFieldOptions}	×
102	value={cellValue as INumberCellValue}	×
103	onChange={onChange}	×
104	readonly={readonly}	×
105	/>	×
106	);	×
107	}	×
108	case FieldType.Rating: {	×
109	return (	×
110	<RatingEditor	×
111	className={className}	×
112	options={options as IRatingFieldOptions}	×
113	value={cellValue as INumberCellValue}	×
114	onChange={onChange}	×
115	readonly={readonly}	×
116	/>	×
117	);	×
118	}	×
119	case FieldType.SingleSelect: {	×
120	return (	×
121	<SelectEditor	×
122	ref={editorRef}	×
123	className={className}	×
124	value={cellValue as ISingleSelectCellValue}	×
NEW 125	options={transformSelectOptions(options as ISelectFieldOptions)}	×
126	onChange={onChange}	×
127	readonly={readonly}	×
128	onOptionAdd={onOptionAdd}	×
129	/>	×
130	);	×
131	}	×
132	case FieldType.MultipleSelect: {	×
133	return (	×
134	<SelectEditor	×
135	ref={editorRef}	×
136	className={className}	×
137	value={cellValue as IMultipleSelectCellValue}	×
NEW 138	options={transformSelectOptions(options as ISelectFieldOptions)}	×
139	onChange={onChange}	×
140	isMultiple	×
141	readonly={readonly}	×
142	onOptionAdd={onOptionAdd}	×
143	/>	×
144	);	×
145	}	×
146	case FieldType.Checkbox: {	×
147	return (	×
148	// Setting the checkbox size is affected by the font-size causing the height to change.	×
149	<div style={{ fontSize: 0 }}>	×
150	<CheckboxEditor	×
151	className={className}	×
152	value={cellValue as ICheckboxCellValue}	×
153	onChange={onChange}	×
154	readonly={readonly}	×
155	/>	×
156	</div>	×
157	);	×
158	}	×
159	case FieldType.Date: {	×
160	return (	×
161	<DateEditor	×
162	ref={editorRef}	×
163	className={className}	×
164	options={options as IDateFieldOptions}	×
165	value={cellValue as string}	×
166	onChange={(selectedDay) => onChange?.(selectedDay ?? null)}	×
NEW 167	readonly={readonly}	×
168	/>	×
169	);	×
170	}	×
171	case FieldType.Attachment: {	×
172	return (	×
173	<AttachmentEditor	×
174	className={className}	×
175	value={cellValue as IAttachmentCellValue}	×
176	onChange={onChange}	×
177	readonly={readonly}	×
178	/>	×
179	);	×
180	}	×
181	case FieldType.Link: {	×
182	return (	×
183	<LinkEditor	×
184	className={className}	×
185	cellValue={cellValue as ILinkCellValue \| ILinkCellValue[]}	×
186	options={options as ILinkFieldOptions}	×
187	onChange={onChange}	×
188	readonly={readonly}	×
189	fieldId={field.id}	×
190	recordId={recordId}	×
191	/>	×
192	);	×
193	}	×
194	case FieldType.User: {	×
195	return (	×
196	<UserEditor	×
197	className={className}	×
198	value={cellValue as IUserCellValue \| IUserCellValue[]}	×
199	options={options as IUserFieldOptions}	×
200	onChange={onChange}	×
201	readonly={readonly}	×
202	/>	×
203	);	×
204	}	×
205	default:	×
206	throw new Error(`The field type (${type}) is not implemented editor`);	×
207	}	×
208	};	×

teableio / teable / 8538004962

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous