Compare commits
No commits in common. "8dd63e1953b4f699aeabeb08fa07449f4dee654a" and "e479fb387e5f4caa8a81db25b75b96914a2c9ce2" have entirely different histories.
8dd63e1953
...
e479fb387e
|
|
@ -87,10 +87,6 @@ const AddTableModal = ({
|
||||||
const [columnTypesFromAPI, setColumnTypesFromAPI] = useState([]);
|
const [columnTypesFromAPI, setColumnTypesFromAPI] = useState([]);
|
||||||
const [loadingColumnTypes, setLoadingColumnTypes] = useState(false);
|
const [loadingColumnTypes, setLoadingColumnTypes] = useState(false);
|
||||||
|
|
||||||
// Table keys from API
|
|
||||||
const [tableKeysFromAPI, setTableKeysFromAPI] = useState([]);
|
|
||||||
const [loadingTableKeys, setLoadingTableKeys] = useState(false);
|
|
||||||
|
|
||||||
// Validation and UI state
|
// Validation and UI state
|
||||||
const [errors, setErrors] = useState({});
|
const [errors, setErrors] = useState({});
|
||||||
const [isSubmitting, setIsSubmitting] = useState(false);
|
const [isSubmitting, setIsSubmitting] = useState(false);
|
||||||
|
|
@ -188,44 +184,6 @@ const AddTableModal = ({
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Fetch table keys from API for a specific table
|
|
||||||
const fetchTableKeys = async (tableSlug) => {
|
|
||||||
if (!tableSlug) {
|
|
||||||
setTableKeysFromAPI([]);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setLoadingTableKeys(true);
|
|
||||||
try {
|
|
||||||
const response = await fetch('https://sandbox.kezel.io/api/qbt_table_key_list_get', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
token: "abdhsg",
|
|
||||||
org: "sN05Pjv11qvH",
|
|
||||||
tbl: tableSlug
|
|
||||||
})
|
|
||||||
});
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
if (data.status === 200 && data.items) {
|
|
||||||
setTableKeysFromAPI(data.items);
|
|
||||||
} else {
|
|
||||||
console.error('Failed to fetch table keys:', data.message);
|
|
||||||
// Fallback to empty array
|
|
||||||
setTableKeysFromAPI([]);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Error fetching table keys:', error);
|
|
||||||
// Fallback to empty array
|
|
||||||
setTableKeysFromAPI([]);
|
|
||||||
} finally {
|
|
||||||
setLoadingTableKeys(false);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const resetForm = () => {
|
const resetForm = () => {
|
||||||
setFormData({
|
setFormData({
|
||||||
name: '',
|
name: '',
|
||||||
|
|
@ -240,8 +198,6 @@ const AddTableModal = ({
|
||||||
setLoadingKeyTypes(false);
|
setLoadingKeyTypes(false);
|
||||||
setColumnTypesFromAPI([]);
|
setColumnTypesFromAPI([]);
|
||||||
setLoadingColumnTypes(false);
|
setLoadingColumnTypes(false);
|
||||||
setTableKeysFromAPI([]);
|
|
||||||
setLoadingTableKeys(false);
|
|
||||||
setErrors({});
|
setErrors({});
|
||||||
setIsSubmitting(false);
|
setIsSubmitting(false);
|
||||||
setKeysViewMode('keys');
|
setKeysViewMode('keys');
|
||||||
|
|
@ -409,7 +365,6 @@ const AddTableModal = ({
|
||||||
targetTable: '',
|
targetTable: '',
|
||||||
sourceKey: '',
|
sourceKey: '',
|
||||||
targetKey: '',
|
targetKey: '',
|
||||||
tableKey: '', // New field for table key from API
|
|
||||||
relationType: '1:N' // 1:1, 1:N, N:M
|
relationType: '1:N' // 1:1, 1:N, N:M
|
||||||
};
|
};
|
||||||
setRelations(prev => [...prev, newRelation]);
|
setRelations(prev => [...prev, newRelation]);
|
||||||
|
|
@ -421,25 +376,6 @@ const AddTableModal = ({
|
||||||
));
|
));
|
||||||
};
|
};
|
||||||
|
|
||||||
// Handle target table selection change
|
|
||||||
const handleTargetTableChange = (relationId, tableId) => {
|
|
||||||
// Update the relation with the new target table
|
|
||||||
updateRelation(relationId, 'targetTable', tableId);
|
|
||||||
|
|
||||||
// Clear the table key selection when target table changes
|
|
||||||
updateRelation(relationId, 'tableKey', '');
|
|
||||||
|
|
||||||
// Find the selected table to get its slug
|
|
||||||
const selectedTable = existingTables.find(table => table.id === tableId);
|
|
||||||
if (selectedTable && selectedTable.tbl) {
|
|
||||||
// Fetch table keys for the selected table
|
|
||||||
fetchTableKeys(selectedTable.tbl);
|
|
||||||
} else {
|
|
||||||
// Clear table keys if no table is selected
|
|
||||||
setTableKeysFromAPI([]);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const removeRelation = (id) => {
|
const removeRelation = (id) => {
|
||||||
setRelations(prev => prev.filter(rel => rel.id !== id));
|
setRelations(prev => prev.filter(rel => rel.id !== id));
|
||||||
};
|
};
|
||||||
|
|
@ -591,7 +527,6 @@ const AddTableModal = ({
|
||||||
target_table: rel.targetTable,
|
target_table: rel.targetTable,
|
||||||
source_key: rel.sourceKey,
|
source_key: rel.sourceKey,
|
||||||
target_key: rel.targetKey,
|
target_key: rel.targetKey,
|
||||||
table_key: rel.tableKey,
|
|
||||||
relation_type: rel.relationType
|
relation_type: rel.relationType
|
||||||
}))
|
}))
|
||||||
};
|
};
|
||||||
|
|
@ -1090,12 +1025,12 @@ const AddTableModal = ({
|
||||||
{relations.map((relation) => (
|
{relations.map((relation) => (
|
||||||
<Paper key={relation.id} variant="outlined" sx={{ p: 2 }}>
|
<Paper key={relation.id} variant="outlined" sx={{ p: 2 }}>
|
||||||
<Grid container spacing={2} alignItems="center">
|
<Grid container spacing={2} alignItems="center">
|
||||||
<Grid item xs={12} md={2.5}>
|
<Grid item xs={12} md={3}>
|
||||||
<FormControl fullWidth size="small">
|
<FormControl fullWidth size="small">
|
||||||
<InputLabel>Target Table</InputLabel>
|
<InputLabel>Target Table</InputLabel>
|
||||||
<Select
|
<Select
|
||||||
value={relation.targetTable}
|
value={relation.targetTable}
|
||||||
onChange={(e) => handleTargetTableChange(relation.id, e.target.value)}
|
onChange={(e) => updateRelation(relation.id, 'targetTable', e.target.value)}
|
||||||
label="Target Table"
|
label="Target Table"
|
||||||
>
|
>
|
||||||
{existingTables.map(table => (
|
{existingTables.map(table => (
|
||||||
|
|
@ -1139,33 +1074,6 @@ const AddTableModal = ({
|
||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} md={2}>
|
|
||||||
<FormControl fullWidth size="small">
|
|
||||||
<InputLabel>Table Key</InputLabel>
|
|
||||||
<Select
|
|
||||||
value={relation.tableKey}
|
|
||||||
onChange={(e) => updateRelation(relation.id, 'tableKey', e.target.value)}
|
|
||||||
label="Table Key"
|
|
||||||
disabled={loadingTableKeys || !relation.targetTable}
|
|
||||||
>
|
|
||||||
{!relation.targetTable ? (
|
|
||||||
<MenuItem disabled>
|
|
||||||
Select a target table first
|
|
||||||
</MenuItem>
|
|
||||||
) : tableKeysFromAPI.length === 0 ? (
|
|
||||||
<MenuItem disabled>
|
|
||||||
{loadingTableKeys ? 'Loading...' : 'No keys available'}
|
|
||||||
</MenuItem>
|
|
||||||
) : (
|
|
||||||
tableKeysFromAPI.map(key => (
|
|
||||||
<MenuItem key={key.key} value={key.key}>
|
|
||||||
{key.name}
|
|
||||||
</MenuItem>
|
|
||||||
))
|
|
||||||
)}
|
|
||||||
</Select>
|
|
||||||
</FormControl>
|
|
||||||
</Grid>
|
|
||||||
{/* <Grid item xs={12} md={2}>
|
{/* <Grid item xs={12} md={2}>
|
||||||
<FormControl fullWidth size="small">
|
<FormControl fullWidth size="small">
|
||||||
<InputLabel>Relation Type</InputLabel>
|
<InputLabel>Relation Type</InputLabel>
|
||||||
|
|
@ -1180,7 +1088,7 @@ const AddTableModal = ({
|
||||||
</Select>
|
</Select>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
</Grid> */}
|
</Grid> */}
|
||||||
<Grid item xs={12} md={1.5}>
|
<Grid item xs={12} md={1}>
|
||||||
<IconButton
|
<IconButton
|
||||||
onClick={() => removeRelation(relation.id)}
|
onClick={() => removeRelation(relation.id)}
|
||||||
color="error"
|
color="error"
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue