Skip to content
This repository was archived by the owner on Apr 28, 2024. It is now read-only.

Commit f9ee97c

Browse files
authored
Merge pull request #105 from slashbaseide/develop
Develop
2 parents efaaf83 + b2c88c4 commit f9ee97c

File tree

7 files changed

+62
-26
lines changed

7 files changed

+62
-26
lines changed

frontend/src/components/dbfragments/jsontable/jsontable.tsx

Lines changed: 24 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -14,19 +14,20 @@ type JsonTablePropType = {
1414
queryData: DBQueryData,
1515
dbConnection: DBConnection
1616
mName: string,
17-
isEditable: boolean,
17+
isInteractive: boolean,
1818
showHeader?: boolean,
1919
onFilterChanged: (newFilter: string[] | undefined) => void,
2020
onSortChanged: (newSort: string[] | undefined) => void,
2121
}
2222

23-
const JsonTable = ({ queryData, dbConnection, mName, isEditable, showHeader, onFilterChanged, onSortChanged }: JsonTablePropType) => {
23+
const JsonTable = ({ queryData, dbConnection, mName, isInteractive, showHeader, onFilterChanged, onSortChanged }: JsonTablePropType) => {
2424

2525
const dispatch = useAppDispatch()
2626

2727
const activeTab: Tab = useContext(TabContext)!
2828

2929
const [isAdding, setIsAdding] = useState<boolean>(false)
30+
const [isEditing, setIsEditing] = useState<boolean>(false)
3031
const [isDeleting, setIsDeleting] = useState<boolean>(false)
3132
const [editingCellIndex, setEditingCellIndex] = useState<(number | null)>(null)
3233

@@ -53,7 +54,7 @@ const JsonTable = ({ queryData, dbConnection, mName, isEditable, showHeader, onF
5354
}
5455

5556
const startEditing = (index: number | null) => {
56-
if (!isEditable) {
57+
if (!(isInteractive && isEditing)) {
5758
return
5859
}
5960
setEditingCellIndex(index)
@@ -69,7 +70,7 @@ const JsonTable = ({ queryData, dbConnection, mName, isEditable, showHeader, onF
6970
}
7071

7172
const changeSort = () => {
72-
if (!isEditable) {
73+
if (!isInteractive) {
7374
return
7475
}
7576
let sort: string[] | undefined = undefined
@@ -112,7 +113,7 @@ const JsonTable = ({ queryData, dbConnection, mName, isEditable, showHeader, onF
112113
defaultColumn,
113114
...{ editingCellIndex, startEditing, onSaveCell }
114115
}, useRowSelect, hooks => {
115-
if (isEditable)
116+
if (isInteractive && isEditing)
116117
hooks.visibleColumns.push(columns => [
117118
{
118119
id: 'selection',
@@ -145,7 +146,7 @@ const JsonTable = ({ queryData, dbConnection, mName, isEditable, showHeader, onF
145146

146147
return (
147148
<React.Fragment>
148-
{(showHeader || isEditable) && <div className={styles.tableHeader}>
149+
{(showHeader || (isInteractive && isEditing)) && <div className={styles.tableHeader}>
149150
<div className="columns">
150151
<div className="column is-3">
151152
<div className="field has-addons">
@@ -167,19 +168,34 @@ const JsonTable = ({ queryData, dbConnection, mName, isEditable, showHeader, onF
167168
</p>
168169
</div>
169170
</div>
170-
{isEditable && <React.Fragment>
171+
{isInteractive && !isEditing && <React.Fragment>
172+
<div className="column is-3 is-flex is-justify-content-flex-end">
173+
<button className="button is-primary" onClick={() => { setIsEditing(true) }}>
174+
<span className="icon is-small">
175+
<i className="fas fa-pen" />
176+
</span>
177+
</button>
178+
</div>
179+
</React.Fragment>}
180+
{isInteractive && isEditing && <React.Fragment>
171181
<div className="column is-3 is-flex is-justify-content-flex-end">
172182
<button className="button" disabled={selectedUnderscoreIDs.length === 0} onClick={() => { setIsDeleting(true) }}>
173183
<span className="icon is-small">
174184
<i className="fas fa-trash" />
175185
</span>
176186
</button>
177187
&nbsp;&nbsp;
178-
<button className="button is-primary" onClick={() => { setIsAdding(true) }}>
188+
<button className="button is-secondary" onClick={() => { setIsAdding(true) }}>
179189
<span className="icon is-small">
180190
<i className="fas fa-plus" />
181191
</span>
182192
</button>
193+
&nbsp;&nbsp;
194+
<button className="button is-primary" onClick={() => { setIsEditing(false) }}>
195+
<span className="icon is-small">
196+
<i className="fas fa-check" />
197+
</span>
198+
</button>
183199
</div>
184200
</React.Fragment>}
185201
</div>

frontend/src/components/dbfragments/query.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,7 @@ const DBQueryFragment = (_: DBQueryPropType) => {
124124
mName={''}
125125
onFilterChanged={() => { }}
126126
onSortChanged={() => { }}
127-
isEditable={false} />
127+
isInteractive={false} />
128128
}
129129
{dbConnection!.type === DBConnType.MONGO &&
130130
<JsonTable
@@ -133,7 +133,7 @@ const DBQueryFragment = (_: DBQueryPropType) => {
133133
mName={''}
134134
onFilterChanged={() => { }}
135135
onSortChanged={() => { }}
136-
isEditable={false} />
136+
isInteractive={false} />
137137
}
138138
</React.Fragment>
139139
: null

frontend/src/components/dbfragments/showdata.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,7 @@ const DBShowDataFragment = (_: DBShowDataPropType) => {
107107
mName={String(mname)}
108108
queryData={queryData}
109109
querySort={querySort}
110-
isEditable={true}
110+
isInteractive={true}
111111
showHeader={true}
112112
onFilterChanged={onFilterChanged}
113113
onSortChanged={onSortChanged}
@@ -120,7 +120,7 @@ const DBShowDataFragment = (_: DBShowDataPropType) => {
120120
mName={String(mname)}
121121
queryData={queryData}
122122
querySort={querySort}
123-
isEditable={true}
123+
isInteractive={true}
124124
showHeader={true}
125125
onFilterChanged={onFilterChanged}
126126
onSortChanged={onSortChanged}
@@ -131,7 +131,7 @@ const DBShowDataFragment = (_: DBShowDataPropType) => {
131131
dbConnection={dbConnection}
132132
mName={String(mname)}
133133
queryData={queryData}
134-
isEditable={true}
134+
isInteractive={true}
135135
showHeader={true}
136136
onFilterChanged={onFilterChanged}
137137
onSortChanged={onSortChanged}

frontend/src/components/dbfragments/table/editablecell.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ const EditableCell = ({
1313
initialValue = Array.isArray(initialValue) ?
1414
`{${initialValue.join(",")}}` : initialValue
1515

16-
initialValue = typeof initialValue === "object" ?
16+
initialValue = (initialValue !== null && typeof initialValue === "object") ?
1717
JSON.stringify(initialValue) : initialValue
1818

1919
// We need to keep and update the state of the cell normally

frontend/src/components/dbfragments/table/table.tsx

Lines changed: 26 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,21 +17,22 @@ type TablePropType = {
1717
dbConnection: DBConnection
1818
mSchema: string,
1919
mName: string,
20-
isEditable: boolean,
20+
isInteractive: boolean,
2121
showHeader?: boolean,
2222
querySort?: string[],
2323
onFilterChanged: (newFilter: string[] | undefined) => void,
2424
onSortChanged: (newSort: string[] | undefined) => void,
2525
}
2626

27-
const Table = ({ queryData, dbConnection, mSchema, mName, isEditable, showHeader, querySort, onFilterChanged, onSortChanged }: TablePropType) => {
27+
const Table = ({ queryData, dbConnection, mSchema, mName, isInteractive, showHeader, querySort, onFilterChanged, onSortChanged }: TablePropType) => {
2828

2929
const dispatch = useAppDispatch()
3030

3131
const activeTab: Tab = useContext(TabContext)!
3232

3333
const [editCell, setEditCell] = useState<(string | number)[]>([])
3434
const [isAdding, setIsAdding] = useState<boolean>(false)
35+
const [isEditing, setIsEditing] = useState<boolean>(false)
3536
const [isDeleting, setIsDeleting] = useState<boolean>(false)
3637

3738
const [filterValue, setFilterValue] = useState<string[]>(['default', 'default', ''])
@@ -41,8 +42,8 @@ const Table = ({ queryData, dbConnection, mSchema, mName, isEditable, showHeader
4142
[queryData]
4243
)
4344

44-
const displayColumns = dbConnection.type === DBConnType.POSTGRES ? queryData.columns.filter(col => col !== 'ctid') : queryData.columns
45-
const ctidExists = queryData.columns.length !== displayColumns.length
45+
const displayColumns = queryData.columns ? dbConnection.type === DBConnType.POSTGRES ? queryData.columns.filter(col => col !== 'ctid') : queryData.columns : []
46+
const ctidExists = queryData.columns ? queryData.columns.length !== displayColumns.length : false
4647

4748
const columns = React.useMemo(
4849
() => displayColumns.map((col, i) => ({
@@ -107,7 +108,7 @@ const Table = ({ queryData, dbConnection, mSchema, mName, isEditable, showHeader
107108
},
108109
useRowSelect,
109110
hooks => {
110-
if (isEditable)
111+
if (isInteractive && isEditing)
111112
hooks.visibleColumns.push(columns => [
112113
{
113114
id: 'selection',
@@ -146,7 +147,7 @@ const Table = ({ queryData, dbConnection, mSchema, mName, isEditable, showHeader
146147
}
147148

148149
const startEditing = (cell: Cell<any, any>) => {
149-
if (isEditable)
150+
if (isInteractive && isEditing)
150151
setEditCell([cell.row.index, cell.column.id])
151152
}
152153

@@ -169,7 +170,7 @@ const Table = ({ queryData, dbConnection, mSchema, mName, isEditable, showHeader
169170
}
170171

171172
const changeSort = (newSortIdx: string) => {
172-
if (!isEditable) {
173+
if (!isInteractive) {
173174
return
174175
}
175176
const newSortName: string = displayColumns.find((_, i) => {
@@ -196,7 +197,7 @@ const Table = ({ queryData, dbConnection, mSchema, mName, isEditable, showHeader
196197

197198
return (
198199
<React.Fragment>
199-
{(showHeader || isEditable) && <div className={styles.tableHeader}>
200+
{(showHeader || (isInteractive && isEditing)) && <div className={styles.tableHeader}>
200201
<div className="columns">
201202
<div className="column is-9">
202203
<div className="field has-addons">
@@ -242,19 +243,34 @@ const Table = ({ queryData, dbConnection, mSchema, mName, isEditable, showHeader
242243
</p>}
243244
</div>
244245
</div>
245-
{isEditable && <React.Fragment>
246+
{isInteractive && !isEditing && <React.Fragment>
247+
<div className="column is-3 is-flex is-justify-content-flex-end">
248+
<button className="button is-primary" onClick={() => { setIsEditing(true) }}>
249+
<span className="icon is-small">
250+
<i className="fas fa-pen" />
251+
</span>
252+
</button>
253+
</div>
254+
</React.Fragment>}
255+
{isInteractive && isEditing && <React.Fragment>
246256
<div className="column is-3 is-flex is-justify-content-flex-end">
247257
<button className="button" disabled={selectedIDs.length === 0} onClick={() => { setIsDeleting(true) }}>
248258
<span className="icon is-small">
249259
<i className="fas fa-trash" />
250260
</span>
251261
</button>
252262
&nbsp;&nbsp;
253-
<button className="button is-primary" onClick={() => { setIsAdding(true) }}>
263+
<button className="button is-secondary" onClick={() => { setIsAdding(true) }}>
254264
<span className="icon is-small">
255265
<i className="fas fa-plus" />
256266
</span>
257267
</button>
268+
&nbsp;&nbsp;
269+
<button className="button is-primary" onClick={() => { setIsEditing(false) }}>
270+
<span className="icon is-small">
271+
<i className="fas fa-check" />
272+
</span>
273+
</button>
258274
</div>
259275
</React.Fragment>}
260276
</div>

pkg/queryengines/mysqlqueryengine/mysqlutils/utils.go

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,11 @@ func MySqlRowsToJson(rows *sql.Rows) ([]string, []map[string]interface{}) {
7878
}
7979
b, ok := val.(sql.RawBytes)
8080
if ok {
81-
v = string(b)
81+
if b == nil {
82+
v = nil
83+
} else {
84+
v = string(b)
85+
}
8286
} else {
8387
v = val
8488
}

wails.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
},
1313
"info": {
1414
"productName": "Slashbase",
15-
"productVersion": "v0.8.2",
15+
"productVersion": "v0.8.3",
1616
"copyright": "Copyright © Slashbase.com",
1717
"comments": "Modern database IDE"
1818
}

0 commit comments

Comments
 (0)