Skip to content

Commit 6c036ec

Browse files
ksvfsksvfs
committed
feat: do not show the default column for column tables
1 parent fea2bbe commit 6c036ec

6 files changed

Lines changed: 84 additions & 17 deletions

File tree

‎src/containers/Tenant/TableFormDialog/TableFormDialog.scss‎

Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,6 +140,7 @@
140140
}
141141

142142
&__columns-table {
143+
--columns-table-separator-width: calc(758px + 5 * var(--g-spacing-4));
143144
display: flex;
144145
flex-direction: column;
145146
gap: var(--g-spacing-3);
@@ -169,6 +170,28 @@
169170
grid-template-columns: 205px 180px 180px 180px 28px;
170171
}
171172

173+
&__columns-table_update {
174+
--columns-table-separator-width: calc(773px + 4 * var(--g-spacing-4));
175+
}
176+
177+
&__columns-table_no-default &__columns-head,
178+
&__columns-table_no-default &__columns-row {
179+
grid-template-columns: 180px 180px 100px 100px 28px;
180+
}
181+
182+
&__columns-table_no-default {
183+
--columns-table-separator-width: calc(588px + 4 * var(--g-spacing-4));
184+
}
185+
186+
#{&}__columns-table_update#{&}__columns-table_no-default #{&}__columns-head,
187+
#{&}__columns-table_update#{&}__columns-table_no-default #{&}__columns-row {
188+
grid-template-columns: 205px 180px 180px 28px;
189+
}
190+
191+
#{&}__columns-table_update#{&}__columns-table_no-default {
192+
--columns-table-separator-width: calc(593px + 3 * var(--g-spacing-4));
193+
}
194+
172195
&__columns-row {
173196
display: grid;
174197
align-items: start;
@@ -229,6 +252,10 @@
229252
}
230253

231254
&__columns-separator {
255+
align-self: flex-start;
256+
257+
width: var(--columns-table-separator-width);
258+
max-width: 100%;
232259
margin: 0;
233260

234261
border: none;
@@ -522,7 +549,7 @@
522549
}
523550

524551
&__disclosure {
525-
margin-top: var(--g-spacing-2);
552+
margin-top: var(--g-spacing-4);
526553

527554
.g-disclosure__trigger {
528555
display: inline-flex;

‎src/containers/Tenant/TableFormDialog/TableFormDialog.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -296,6 +296,7 @@ function TableForm({
296296
<GeneralSection mode={mode} nameInputRef={nameInputRef} />
297297
<YdbColumnsSection
298298
mode={mode}
299+
tableType={type}
299300
types={columnTypes}
300301
pkTypes={pkTypes}
301302
keyNullable={keyNullable}

‎src/containers/Tenant/TableFormDialog/sections/SettingsSection.tsx‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -308,9 +308,6 @@ export function SettingsSection({mode}: SettingsSectionProps) {
308308
)}
309309
/>
310310
</FormRow>
311-
</FormSection>
312-
313-
<FormSection>
314311
<Disclosure
315312
summary={
316313
<Text as="span" variant="subheader-2">

‎src/containers/Tenant/TableFormDialog/sections/YdbColumnsSection.tsx‎

Lines changed: 48 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import {Controller, useFieldArray, useFormContext, useWatch} from 'react-hook-fo
1717
import {cn} from '../../../../utils/cn';
1818
import {FormFieldError, FormSection} from '../components/layout';
1919
import i18n from '../i18n';
20-
import type {Column, FormMode, FormValues, OriginalTableInfo} from '../types';
20+
import type {Column, FormMode, FormValues, OriginalTableInfo, TableType} from '../types';
2121
import {
2222
generateColumnId,
2323
getAutoincrementDisabledMessage,
@@ -29,6 +29,7 @@ const b = cn('ydb-table-form-dialog');
2929

3030
interface YdbColumnsSectionProps {
3131
mode: FormMode;
32+
tableType: TableType;
3233
types: string[];
3334
pkTypes: Set<string>;
3435
keyNullable: boolean;
@@ -37,6 +38,7 @@ interface YdbColumnsSectionProps {
3738

3839
export function YdbColumnsSection({
3940
mode,
41+
tableType,
4042
types,
4143
pkTypes,
4244
keyNullable,
@@ -146,6 +148,7 @@ export function YdbColumnsSection({
146148
}, [originalInfo?.indexes]);
147149
const primaryKeyColumnNames = primaryOriginalColumns.map((column) => column.name);
148150
const partitionKeyColumnNames = originalInfo?.partitionKey ?? [];
151+
const showDefaultColumn = tableType === 'row';
149152

150153
return (
151154
<FormSection title={i18n('label_columns')}>
@@ -163,7 +166,12 @@ export function YdbColumnsSection({
163166
) : null}
164167
</div>
165168
) : null}
166-
<div className={b('columns-table', {update: mode === 'update'})}>
169+
<div
170+
className={b('columns-table', {
171+
update: mode === 'update',
172+
'no-default': !showDefaultColumn,
173+
})}
174+
>
167175
{showHeader ? (
168176
<React.Fragment>
169177
<div className={b('columns-head')}>
@@ -184,7 +192,11 @@ export function YdbColumnsSection({
184192
</div>
185193
) : null}
186194
<div className={b('columns-head-cell')}>{i18n('column_not-null')}</div>
187-
<div className={b('columns-head-cell')}>{i18n('column_default')}</div>
195+
{showDefaultColumn ? (
196+
<div className={b('columns-head-cell')}>
197+
{i18n('column_default')}
198+
</div>
199+
) : null}
188200
<div />
189201
</div>
190202
<hr className={b('columns-separator')} />
@@ -194,7 +206,11 @@ export function YdbColumnsSection({
194206
{mode === 'update' && primaryOriginalColumns.length > 0 ? (
195207
<React.Fragment>
196208
{primaryOriginalColumns.map((column) => (
197-
<PrimaryColumnRow key={`pk-${column.name}`} column={column} />
209+
<PrimaryColumnRow
210+
key={`pk-${column.name}`}
211+
column={column}
212+
showDefaultColumn={showDefaultColumn}
213+
/>
198214
))}
199215
<hr className={b('columns-separator')} />
200216
</React.Fragment>
@@ -207,10 +223,12 @@ export function YdbColumnsSection({
207223
(deleted) => deleted.name === column.name,
208224
);
209225
const isDeleting = deletedIndex >= 0;
226+
210227
return (
211228
<NonPrimaryColumnRow
212229
key={`existing-${column.name}`}
213230
column={column}
231+
showDefaultColumn={showDefaultColumn}
214232
isDeleting={isDeleting}
215233
deleteDisabledMessage={getDeleteDisabledMessage({
216234
columnName: column.name,
@@ -231,6 +249,7 @@ export function YdbColumnsSection({
231249
key={field.id}
232250
index={index}
233251
mode={mode}
252+
showDefaultColumn={showDefaultColumn}
234253
typeOptions={typeOptions}
235254
pkTypes={pkTypes}
236255
keyNullable={keyNullable}
@@ -317,28 +336,40 @@ function formatDefaultValue(column: Column) {
317336
return String(column.defaultValue);
318337
}
319338

320-
function PrimaryColumnRow({column}: {column: Column}) {
339+
function PrimaryColumnRow({
340+
column,
341+
showDefaultColumn,
342+
}: {
343+
column: Column;
344+
showDefaultColumn: boolean;
345+
}) {
321346
return (
322347
<div className={b('columns-row', {readonly: true})}>
323348
<div className={b('columns-cell', {name: true})}>{column.name}</div>
324349
<div className={b('columns-cell', {type: true})}>{column.type}</div>
325350
<div className={b('columns-cell', {'not-null': true})}>
326351
{column.notNull ? i18n('value_yes') : i18n('value_no')}
327352
</div>
328-
<div className={b('columns-cell', {default: true})}>{formatDefaultValue(column)}</div>
353+
{showDefaultColumn ? (
354+
<div className={b('columns-cell', {default: true})}>
355+
{formatDefaultValue(column)}
356+
</div>
357+
) : null}
329358
<div />
330359
</div>
331360
);
332361
}
333362

334363
function NonPrimaryColumnRow({
335364
column,
365+
showDefaultColumn,
336366
isDeleting,
337367
deleteDisabledMessage,
338368
onDelete,
339369
onUndo,
340370
}: {
341371
column: Column;
372+
showDefaultColumn: boolean;
342373
isDeleting: boolean;
343374
deleteDisabledMessage?: string;
344375
onDelete: () => void;
@@ -351,7 +382,11 @@ function NonPrimaryColumnRow({
351382
<div className={b('columns-cell', {'not-null': true})}>
352383
{column.notNull ? i18n('value_yes') : i18n('value_no')}
353384
</div>
354-
<div className={b('columns-cell', {default: true})}>{formatDefaultValue(column)}</div>
385+
{showDefaultColumn ? (
386+
<div className={b('columns-cell', {default: true})}>
387+
{formatDefaultValue(column)}
388+
</div>
389+
) : null}
355390
<div className={b('columns-cell', {action: true})}>
356391
{isDeleting ? (
357392
<Button view="flat" size="m" onClick={onUndo} title={i18n('action_undo')}>
@@ -378,6 +413,7 @@ function NonPrimaryColumnRow({
378413
interface EditableColumnRowProps {
379414
index: number;
380415
mode: FormMode;
416+
showDefaultColumn: boolean;
381417
typeOptions: SelectOption[];
382418
pkTypes: Set<string>;
383419
keyNullable: boolean;
@@ -390,6 +426,7 @@ interface EditableColumnRowProps {
390426
function EditableColumnRow({
391427
index,
392428
mode,
429+
showDefaultColumn,
393430
typeOptions,
394431
pkTypes,
395432
keyNullable,
@@ -430,7 +467,7 @@ function EditableColumnRow({
430467
const keyDisabled = !pkTypes.has(column.type);
431468
let defaultValueControl: React.ReactNode = null;
432469

433-
if (mode === 'create') {
470+
if (mode === 'create' && showDefaultColumn) {
434471
if (column.key) {
435472
defaultValueControl = (
436473
<div className={b('checkbox-control')}>
@@ -573,7 +610,9 @@ function EditableColumnRow({
573610
/>
574611
) : null}
575612
</div>
576-
<div className={b('columns-cell', {default: true})}>{defaultValueControl}</div>
613+
{showDefaultColumn ? (
614+
<div className={b('columns-cell', {default: true})}>{defaultValueControl}</div>
615+
) : null}
577616
<div className={b('columns-cell', {action: true})}>
578617
<Button
579618
view="flat"

‎src/store/reducers/table/table.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ export const tableApi = api.injectEndpoints({
5555

5656
const options: BuildTemplateOptions = {
5757
tableName: name,
58-
columns: prepareYdbCreateQueryColumns(columns),
58+
columns: prepareYdbCreateQueryColumns(columns, type),
5959
...(type === 'row' && {secondaryIndexes}),
6060
...(type === 'column' && {columnsHash: partitionKey}),
6161
settings:

‎src/store/reducers/table/utils.ts‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -649,16 +649,19 @@ export function buildUpdateTableQuery(options: BuildTemplateOptions) {
649649
return buildTemplate(UPDATE_TABLE_QUERY_TEMPLATE, options);
650650
}
651651

652-
export function prepareYdbCreateQueryColumns(columns: ColumnField[]): Column[] {
652+
export function prepareYdbCreateQueryColumns(
653+
columns: ColumnField[],
654+
tableType: TableFormValues['type'] = 'row',
655+
): Column[] {
653656
return columns.map((column) => ({
654657
name: column.name,
655658
type: column.type,
656659
key: column.key,
657660
notNull: column.notNull,
658661
defaultValue:
659-
column.withDefaultValue && !column.key && !column.autoincrement
662+
tableType === 'row' && column.withDefaultValue && !column.key && !column.autoincrement
660663
? column.defaultValue
661664
: undefined,
662-
autoincrement: column.autoincrement,
665+
autoincrement: tableType === 'row' ? column.autoincrement : undefined,
663666
}));
664667
}

0 commit comments

Comments
 (0)