random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2026-01-08 12:07:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Dynamic DetailsList and others implementation

Browse Source
This commit is contained in:
vaidankarswapnil
2021-07-30 14:23:10 +05:30
parent 4f632b234f
commit 08d04295b1
6 changed files with 413 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/Explorer/Panes/Tables/AddTableEntityPanel.tsx
View File

@@ -43,6 +43,7 @@ interface AddTableEntityPanelProps {
// queryTablesTab: QueryTablesTab;
tableEntityListViewModel: TableEntityListViewModel;
cassandraApiClient: CassandraAPIDataClient;
reloadEntities: () => void;
}
interface EntityRowType {
@@ -62,6 +63,7 @@ export const AddTableEntityPanel: FunctionComponent<AddTableEntityPanelProps> =
queryTablesTab,
tableEntityListViewModel,
cassandraApiClient,
reloadEntities,
}: AddTableEntityPanelProps): JSX.Element => {
const closeSidePanel = useSidePanel((state) => state.closeSidePanel);
const [entities, setEntities] = useState<EntityRowType[]>([]);
@@ -108,9 +110,11 @@ export const AddTableEntityPanel: FunctionComponent<AddTableEntityPanelProps> =
const entity: Entities.ITableEntity = entityFromAttributes(entities);
const newEntity: Entities.ITableEntity = await tableDataClient.createDocument(queryTablesTab.collection, entity);
console.log("🚀 ~ file: AddTableEntityPanel.tsx ~ line 113 ~ submit ~ newEntity", newEntity);
await tableEntityListViewModel.addEntityToCache(newEntity);
if (!tryInsertNewHeaders(tableEntityListViewModel, newEntity)) {
tableEntityListViewModel.redrawTableThrottled();
// tableEntityListViewModel.redrawTableThrottled();
reloadEntities();
}
closeSidePanel();
};

16
src/Explorer/Panes/Tables/EditTableEntityPanel.tsx
View File

@@ -40,6 +40,8 @@ interface EditTableEntityPanelProps {
// queryTablesTab: QueryTablesTab;
tableEntityListViewModel: TableEntityListViewModel;
cassandraApiClient: CassandraAPIDataClient;
selectedEntity: Entities.ITableEntity[];
reloadEntities: () => void;
}
interface EntityRowType {
@@ -60,6 +62,8 @@ export const EditTableEntityPanel: FunctionComponent<EditTableEntityPanelProps>
queryTablesTab,
tableEntityListViewModel,
cassandraApiClient,
selectedEntity,
reloadEntities,
}: EditTableEntityPanelProps): JSX.Element => {
const closeSidePanel = useSidePanel((state) => state.closeSidePanel);
const [entities, setEntities] = useState<EntityRowType[]>([]);
@@ -77,8 +81,15 @@ export const EditTableEntityPanel: FunctionComponent<EditTableEntityPanelProps>
// eslint-disable-next-line @typescript-eslint/no-explicit-any
let originalDocument: { [key: string]: any } = {};
// eslint-disable-next-line @typescript-eslint/no-explicit-any
const entityAttribute: any = tableEntityListViewModel.selected();
// const entityAttribute: any = tableEntityListViewModel.selected();
// const entityFormattedAttribute = constructDisplayedAttributes(entityAttribute[0]);
const entityAttribute: any = selectedEntity;
console.log("🚀 ~ file: EditTableEntityPanel.tsx ~ line 86 ~ useEffect ~ entityAttribute", entityAttribute);
const entityFormattedAttribute = constructDisplayedAttributes(entityAttribute[0]);
console.log(
"🚀 ~ file: EditTableEntityPanel.tsx ~ line 88 ~ useEffect ~ entityFormattedAttribute",
entityFormattedAttribute
);
setEntities(entityFormattedAttribute);
if (userContext.apiType === "Tables") {
@@ -207,7 +218,8 @@ export const EditTableEntityPanel: FunctionComponent<EditTableEntityPanelProps>
);
await tableEntityListViewModel.updateCachedEntity(newEntity);
if (!tryInsertNewHeaders(tableEntityListViewModel, newEntity)) {
tableEntityListViewModel.redrawTableThrottled();
// tableEntityListViewModel.redrawTableThrottled();
reloadEntities();
}
tableEntityListViewModel.selected.removeAll();
tableEntityListViewModel.selected.push(newEntity);

14
src/Explorer/Panes/Tables/TableQuerySelectPanel/TableQuerySelectPanel.tsx
View File

@@ -8,6 +8,8 @@ import { RightPaneForm, RightPaneFormProps } from "../../RightPaneForm/RightPane
interface TableQuerySelectPanelProps {
queryViewModel: QueryViewModel;
headers: string[];
getSelectMessage: (selectMessage: string) => void;
}
interface ISelectColumn {
@@ -18,7 +20,10 @@ interface ISelectColumn {
export const TableQuerySelectPanel: FunctionComponent<TableQuerySelectPanelProps> = ({
queryViewModel,
headers,
getSelectMessage,
}: TableQuerySelectPanelProps): JSX.Element => {
console.log("🚀 ~ file: TableQuerySelectPanel.tsx ~ line 22 ~ queryViewModel", queryViewModel);
const closeSidePanel = useSidePanel((state) => state.closeSidePanel);
const [columnOptions, setColumnOptions] = useState<ISelectColumn[]>([
@@ -29,6 +34,11 @@ export const TableQuerySelectPanel: FunctionComponent<TableQuerySelectPanelProps
const onSubmit = (): void => {
queryViewModel.selectText(getParameters());
queryViewModel.getSelectMessage();
console.log(
"🚀 ~ file: TableQuerySelectPanel.tsx ~ line 50 ~ onSubmit ~ queryViewModel.selectMessage()",
queryViewModel.selectMessage()
);
getSelectMessage(queryViewModel.selectMessage());
closeSidePanel();
};
@@ -52,7 +62,9 @@ export const TableQuerySelectPanel: FunctionComponent<TableQuerySelectPanelProps
};
useEffect(() => {
queryViewModel && setTableColumns(queryViewModel.columnOptions());
// queryViewModel && setTableColumns(queryViewModel.columnOptions());
headers && setTableColumns(headers);
console.log("🚀 ~ file: TableQuerySelectPanel.tsx ~ line 67 ~ useEffect ~ headers", headers);
}, []);
const setTableColumns = (columnNames: string[]): void => {