Skip to content

Commit 9b3be18

Browse files
sadakchapsadakchap
committed
giving option to clone or cancel per row for failed clone rows
1 parent 59aeb63 commit 9b3be18

File tree

2 files changed

+116
-29
lines changed

2 files changed

+116
-29
lines changed

‎src/dashboard/Data/Browser/Browser.react.js

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -125,6 +125,8 @@ class Browser extends DashboardView {
125125
this.addEditCloneRows = this.addEditCloneRows.bind(this);
126126
this.abortAddRow = this.abortAddRow.bind(this);
127127
this.saveNewRow = this.saveNewRow.bind(this);
128+
this.saveEditCloneRow = this.saveEditCloneRow.bind(this);
129+
this.abortEditCloneRow = this.abortEditCloneRow.bind(this);
128130
}
129131

130132
componentWillMount() {
@@ -366,6 +368,58 @@ class Browser extends DashboardView {
366368
);
367369
}
368370

371+
saveEditCloneRow(rowIndex) {
372+
let obj;
373+
if (rowIndex < -1) {
374+
obj = this.state.editCloneRows[
375+
rowIndex + (this.state.editCloneRows.length + 1)
376+
];
377+
}
378+
if (!obj) {
379+
return;
380+
}
381+
obj.save(null, { useMasterKey: true }).then((objectSaved) => {
382+
let msg = objectSaved.className + ' with id \'' + objectSaved.id + '\' ' + 'created';
383+
this.showNote(msg, false);
384+
385+
const state = { data: this.state.data, editCloneRows: this.state.editCloneRows };
386+
state.editCloneRows = state.editCloneRows.filter(
387+
cloneObj => cloneObj._localId !== obj._localId
388+
);
389+
if (state.editCloneRows.length === 0) state.editCloneRows = null;
390+
if (this.props.params.className === obj.className) {
391+
this.state.data.unshift(obj);
392+
}
393+
this.state.counts[obj.className] += 1;
394+
this.setState(state);
395+
}, (error) => {
396+
let msg = typeof error === 'string' ? error : error.message;
397+
if (msg) {
398+
msg = msg[0].toUpperCase() + msg.substr(1);
399+
}
400+
401+
this.showNote(msg, true);
402+
});
403+
}
404+
405+
abortEditCloneRow(rowIndex) {
406+
let obj;
407+
if (rowIndex < -1) {
408+
obj = this.state.editCloneRows[
409+
rowIndex + (this.state.editCloneRows.length + 1)
410+
];
411+
}
412+
if (!obj) {
413+
return;
414+
}
415+
const state = { editCloneRows: this.state.editCloneRows };
416+
state.editCloneRows = state.editCloneRows.filter(
417+
cloneObj => cloneObj._localId !== obj._localId
418+
);
419+
if (state.editCloneRows.length === 0) state.editCloneRows = null;
420+
this.setState(state);
421+
}
422+
369423
addRowWithModal() {
370424
this.addRow();
371425
this.selectRow(undefined, true);
@@ -653,6 +707,16 @@ class Browser extends DashboardView {
653707
});
654708
return;
655709
}
710+
if (isEditCloneObj) {
711+
const editObjIndex = row + (this.state.editCloneRows.length + 1);
712+
let cloneRows = [...this.state.editCloneRows];
713+
cloneRows.splice(editObjIndex, 1, obj);
714+
this.setState({
715+
editCloneRows: cloneRows
716+
});
717+
return;
718+
}
719+
656720
obj.save(null, { useMasterKey: true }).then((objectSaved) => {
657721
const createdOrUpdated = isNewObject || isEditCloneObj ? 'created' : 'updated';
658722
let msg = objectSaved.className + ' with id \'' + objectSaved.id + '\' ' + createdOrUpdated;
@@ -1159,6 +1223,8 @@ class Browser extends DashboardView {
11591223
onEditPermissions={this.onDialogToggle}
11601224
onSaveNewRow={this.saveNewRow}
11611225
onAbortAddRow={this.abortAddRow}
1226+
onSaveEditCloneRow={this.saveEditCloneRow}
1227+
onAbortEditCloneRow={this.abortEditCloneRow}
11621228

11631229
columns={columns}
11641230
className={className}

‎src/dashboard/Data/Browser/BrowserTable.react.js

Lines changed: 50 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -118,38 +118,56 @@ export default class BrowserTable extends React.Component {
118118
let editCloneRows = null;
119119
if(this.props.editCloneRows){
120120
editCloneRows = (
121-
<div style={{ marginBottom: 30, borderBottom: '1px solid #169CEE' }}>
121+
<div>
122122
{this.props.editCloneRows.map((cloneRow, idx) => {
123123
let index = (this.props.editCloneRows.length + 1) * -1 + idx;
124124
const currentCol = this.props.current && this.props.current.row === index ? this.props.current.col : undefined;
125125
const isEditingRow = this.props.current && this.props.current.row === index && !!this.props.editing;
126126
return (
127-
<BrowserRow
128-
key={index}
129-
isEditing={isEditingRow}
130-
className={this.props.className}
131-
columns={this.props.columns}
132-
schema={this.props.schema}
133-
simplifiedSchema={this.props.simplifiedSchema}
134-
filters={this.props.filters}
135-
currentCol={currentCol}
136-
isUnique={this.props.isUnique}
137-
obj={cloneRow}
138-
onPointerClick={this.props.onPointerClick}
139-
onFilterChange={this.props.onFilterChange}
140-
order={this.props.order}
141-
readOnlyFields={READ_ONLY}
142-
row={index}
143-
rowWidth={rowWidth}
144-
selection={this.props.selection}
145-
selectRow={this.props.selectRow}
146-
setCurrent={this.props.setCurrent}
147-
setEditing={this.props.setEditing}
148-
setRelation={this.props.setRelation}
149-
setCopyableValue={this.props.setCopyableValue}
150-
setContextMenu={this.props.setContextMenu}
151-
onEditSelectedRow={this.props.onEditSelectedRow}
152-
/>
127+
<div key={index} style={{ borderBottom: '1px solid #169CEE' }}>
128+
<BrowserRow
129+
key={index}
130+
isEditing={isEditingRow}
131+
className={this.props.className}
132+
columns={this.props.columns}
133+
schema={this.props.schema}
134+
simplifiedSchema={this.props.simplifiedSchema}
135+
filters={this.props.filters}
136+
currentCol={currentCol}
137+
isUnique={this.props.isUnique}
138+
obj={cloneRow}
139+
onPointerClick={this.props.onPointerClick}
140+
onFilterChange={this.props.onFilterChange}
141+
order={this.props.order}
142+
readOnlyFields={READ_ONLY}
143+
row={index}
144+
rowWidth={rowWidth}
145+
selection={this.props.selection}
146+
selectRow={this.props.selectRow}
147+
setCurrent={this.props.setCurrent}
148+
setEditing={this.props.setEditing}
149+
setRelation={this.props.setRelation}
150+
setCopyableValue={this.props.setCopyableValue}
151+
setContextMenu={this.props.setContextMenu}
152+
onEditSelectedRow={this.props.onEditSelectedRow}
153+
/>
154+
<Button
155+
value="Clone"
156+
width="55px"
157+
primary={true}
158+
onClick={() => {
159+
this.props.onSaveEditCloneRow(index);
160+
this.props.setEditing(false);
161+
}}
162+
additionalStyles={{ fontSize: '12px', height: '20px', lineHeight: '20px', margin: '5px', padding: '0'}}
163+
/>
164+
<Button
165+
value="Cancel"
166+
width="55px"
167+
onClick={() => this.props.onAbortEditCloneRow(index)}
168+
additionalStyles={{ fontSize: '12px', height: '20px', lineHeight: '20px', margin: '5px', padding: '0'}}
169+
/>
170+
</div>
153171
);
154172
})}
155173
</div>
@@ -287,13 +305,16 @@ export default class BrowserTable extends React.Component {
287305
}
288306
let wrapTop = Math.max(0, this.props.current.row * ROW_HEIGHT);
289307
if(this.props.current.row < -1 && this.props.editCloneRows){
290-
wrapTop = ROW_HEIGHT * (this.props.current.row + (this.props.editCloneRows.length + 1));
308+
//for edit clone rows
309+
wrapTop = (2 * ROW_HEIGHT) * (this.props.current.row + (this.props.editCloneRows.length + 1));
291310
}
292311
if (this.props.current.row > -1 && this.props.newObject) {
312+
//for data rows when there's new row
293313
wrapTop += 60;
294314
}
295315
if (this.props.current.row >= -1 && this.props.editCloneRows) {
296-
wrapTop += ROW_HEIGHT * (this.props.editCloneRows.length + 1);
316+
//for data rows & new row when there are edit clone rows
317+
wrapTop += (ROW_HEIGHT) * (this.props.editCloneRows.length + 1 + 1);
297318
}
298319
let wrapLeft = 30;
299320
for (let i = 0; i < this.props.current.col; i++) {

0 commit comments

Comments
 (0)