mirrors/dbgate
1
0
Fork 0
mirror of https://github.com/dbgate/dbgate synced 2024-11-07 20:26:23 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

app object refactor finished

Browse Source
This commit is contained in:
Jan Prochazka 2020-12-03 11:59:49 +01:00
parent 2afd46dc91
commit 655429693a
5 changed files with 30 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/web/src/appobj/columnAppObject.js
View File

@ -1,15 +0,0 @@
/** @param columnProps {import('dbgate-types').ColumnInfo} */
function getColumnIcon(columnProps) {
if (columnProps.autoIncrement) return 'img autoincrement';
return 'img column';
}
/** @param columnProps {import('dbgate-types').ColumnInfo} */
export default function columnAppObject(columnProps, { setOpenedTabs }) {
const title = columnProps.columnName;
const key = title;
const icon = getColumnIcon(columnProps);
const isBold = columnProps.notNull;
return { title, key, icon, isBold };
}

15
packages/web/src/appobj/constraintAppObject.js
View File

@ -1,15 +0,0 @@
/** @param props {import('dbgate-types').ConstraintInfo} */
function getConstraintIcon(props) {
if (props.constraintType == 'primaryKey') return 'img primary-key';
if (props.constraintType == 'foreignKey') return 'img foreign-key';
return null;
}
/** @param props {import('dbgate-types').ConstraintInfo} */
export default function constraintAppObject(props, { setOpenedTabs }) {
const title = props.constraintName;
const key = title;
const icon = getConstraintIcon(props);
return { title, key, icon };
}

4
packages/web/src/datagrid/ColumnLabel.js
View File

@ -5,13 +5,13 @@ import styled from 'styled-components';
import { FontIcon } from '../icons';
const Label = styled.span`
font-weight: ${props => (props.notNull ? 'bold' : 'normal')};
font-weight: ${(props) => (props.notNull ? 'bold' : 'normal')};
white-space: nowrap;
`;
/** @param column {import('dbgate-datalib').DisplayColumn|import('dbgate-types').ColumnInfo} */
export default function ColumnLabel(column) {
let icon = null;
let icon = column.forceIcon ? 'img column' : null;
if (column.autoIncrement) icon = 'img autoincrement';
if (column.foreignKey) icon = 'img foreign-key';
return (

32
packages/web/src/tabs/TableStructureTab.js
View File

@ -3,10 +3,10 @@ import styled from 'styled-components';
import _ from 'lodash';
import ObjectListControl from '../utility/ObjectListControl';
import { TableColumn } from '../utility/TableControl';
import columnAppObject from '../appobj/columnAppObject';
import constraintAppObject from '../appobj/constraintAppObject';
import { useTableInfo, useDbCore } from '../utility/metadataLoaders';
import useTheme from '../theme/useTheme';
import ColumnLabel from '../datagrid/ColumnLabel';
import { FontIcon } from '../icons';
const WhitePage = styled.div`
position: absolute;
@ -18,6 +18,25 @@ const WhitePage = styled.div`
overflow: auto;
`;
const IconTextSpan = styled.span`
white-space: nowrap;
`;
function getConstraintIcon(data) {
if (data.constraintType == 'primaryKey') return 'img primary-key';
if (data.constraintType == 'foreignKey') return 'img foreign-key';
return null;
}
function ConstraintLabel({ data }) {
const icon = getConstraintIcon(data);
return (
<IconTextSpan>
<FontIcon icon={icon} /> {data.constraintName}
</IconTextSpan>
);
}
export default function TableStructureTab({ conid, database, schemaName, pureName, objectTypeField = 'tables' }) {
const theme = useTheme();
const tableInfo = useDbCore({ conid, database, schemaName, pureName, objectTypeField });
@ -27,7 +46,8 @@ export default function TableStructureTab({ conid, database, schemaName, pureNam
<WhitePage theme={theme}>
<ObjectListControl
collection={columns.map((x, index) => ({ ...x, ordinal: index + 1 }))}
makeAppObj={columnAppObject}
NameComponent={({ data }) => <ColumnLabel {...data} forceIcon />}
// makeAppObj={columnAppObject}
title="Columns"
>
<TableColumn
@ -77,7 +97,7 @@ export default function TableStructureTab({ conid, database, schemaName, pureNam
/> */}
</ObjectListControl>
<ObjectListControl collection={_.compact([primaryKey])} makeAppObj={constraintAppObject} title="Primary key">
<ObjectListControl collection={_.compact([primaryKey])} NameComponent={ConstraintLabel} title="Primary key">
<TableColumn
fieldName="columns"
header="Columns"
@ -85,7 +105,7 @@ export default function TableStructureTab({ conid, database, schemaName, pureNam
/>
</ObjectListControl>
<ObjectListControl collection={foreignKeys} makeAppObj={constraintAppObject} title="Foreign keys">
<ObjectListControl collection={foreignKeys} NameComponent={ConstraintLabel} title="Foreign keys">
<TableColumn
fieldName="baseColumns"
header="Base columns"
@ -101,7 +121,7 @@ export default function TableStructureTab({ conid, database, schemaName, pureNam
<TableColumn fieldName="deleteAction" header="ON DELETE" />
</ObjectListControl>
<ObjectListControl collection={dependencies} makeAppObj={constraintAppObject} title="Dependencies">
<ObjectListControl collection={dependencies} NameComponent={ConstraintLabel} title="Dependencies">
<TableColumn
fieldName="baseColumns"
header="Base columns"

8
packages/web/src/utility/ObjectListControl.js
View File

@ -25,7 +25,7 @@ const ObjectListBody = styled.div`
// margin-top: 3px;
`;
export default function ObjectListControl({ collection = [], title, showIfEmpty = false, makeAppObj, children }) {
export default function ObjectListControl({ collection = [], title, showIfEmpty = false, NameComponent, children }) {
const theme = useTheme();
if (collection.length == 0 && !showIfEmpty) return null;
@ -36,11 +36,7 @@ export default function ObjectListControl({ collection = [], title, showIfEmpty
</ObjectListHeader>
<ObjectListBody>
<TableControl rows={collection}>
<TableColumn
fieldName="displayName"
header="Name"
// formatter={(col) => <AppObjectControl data={col} makeAppObj={makeAppObj} component="span" />}
/>
<TableColumn fieldName="displayName" header="Name" formatter={(data) => <NameComponent data={data} />} />
{children}
</TableControl>
</ObjectListBody>