From f3732a076cf55d4f80d4e154db635fb521da2205 Mon Sep 17 00:00:00 2001 From: Laurent Nguyen Date: Wed, 1 May 2024 16:09:38 +0200 Subject: [PATCH] Remove comments and unused code --- .../Tabs/DocumentsTabV2/DocumentsTabV2.tsx | 226 ++++-------------- 1 file changed, 44 insertions(+), 182 deletions(-) diff --git a/src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.tsx b/src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.tsx index d148cbbaf..22075c278 100644 --- a/src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.tsx +++ b/src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.tsx @@ -392,7 +392,7 @@ const _loadNextPageInternal = ( return iterator.fetchNext().then((response) => response.resources); }; -// Export for testing purposes +// Export to expose to unit tests export const showPartitionKey = (collection: ViewModels.CollectionBase, isPreferredApiMongoDB: boolean) => { if (!collection) { return false; @@ -409,7 +409,7 @@ export const showPartitionKey = (collection: ViewModels.CollectionBase, isPrefer return true; }; -// Export for testing purposes +// Export to expose to unit tests export const buildQuery = ( isMongo: boolean, filter: string, @@ -450,13 +450,8 @@ const DocumentsTabComponent: React.FunctionComponent<{ const [isFilterExpanded, setIsFilterExpanded] = useState(false); const [appliedFilter, setAppliedFilter] = useState(""); const [filterContent, setFilterContent] = useState(""); - // const [lastFilterContents, setLastFilterContents] = useState([ - // 'WHERE c.id = "foo"', - // "ORDER BY c._ts DESC", - // 'WHERE c.id = "foo" ORDER BY c._ts DESC', - // ]); const [documentIds, setDocumentIds] = useState([]); - const [isExecuting, setIsExecuting] = useState(false); // TODO isExecuting is a member of TabsBase. We may need to update this field. + const [isExecuting, setIsExecuting] = useState(false); // Query const [documentsIterator, setDocumentsIterator] = useState<{ @@ -530,24 +525,15 @@ const DocumentsTabComponent: React.FunctionComponent<{ [partitionKey], ); - // const isPreferredApiMongoDB = useMemo( - // () => userContext.apiType === "Mongo" || isPreferredApiMongoDB, - // [isPreferredApiMongoDB], - // ); - useEffect(() => { setDocumentIds(_documentIds); }, [_documentIds]); - // TODO: this is executed in onActivate() in the original code. + // This is executed in onActivate() in the original code. useEffect(() => { if (!documentsIterator) { try { refreshDocumentsGrid(); - // // Select first document and load content - // if (documentIds.length > 0) { - // documentIds[0].click(); - // } } catch (error) { if (onLoadStartKey !== null && onLoadStartKey !== undefined) { TelemetryProcessor.traceFailure( @@ -595,10 +581,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ case ViewModels.DocumentExplorerState.exisitingDocumentDirtyValid: return true; - // return ( - // this.selectedDocumentContent.getEditableOriginalValue() !== - // this.selectedDocumentContent.getEditableCurrentValue() - // ); default: return false; @@ -625,7 +607,7 @@ const DocumentsTabComponent: React.FunctionComponent<{ [isEditorDirty], ); - // Update tab if isExecuting has changed + // Update parent (tab) if isExecuting has changed useEffect(() => { onIsExecutingChange(isExecuting); }, [onIsExecutingChange, isExecuting]); @@ -636,7 +618,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ ); const initializeNewDocument = (): void => { - // this.selectedDocumentId(null); const defaultDocument: string = renderObjectForEditor({ id: "replace_with_new_document_id" }, null, 4); setInitialDocumentContent(defaultDocument); setSelectedDocumentContent(defaultDocument); @@ -669,7 +650,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ const ids = documentIds; ids.push(id); - // this.selectedDocumentId(id); setDocumentIds(ids); setEditorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits); TelemetryProcessor.traceSuccess( @@ -717,8 +697,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ }, [setInitialDocumentContent, setSelectedDocumentContent, setEditorState]); let onSaveExistingDocumentClick = useCallback((): Promise => { - // const selectedDocumentId = this.selectedDocumentId(); - const documentContent = JSON.parse(selectedDocumentContent); const partitionKeyValueArray: PartitionKey[] = extractPartitionKeyValues( @@ -778,15 +756,8 @@ const DocumentsTabComponent: React.FunctionComponent<{ const onRevertExistingDocumentClick = useCallback((): void => { setSelectedDocumentContentBaseline(initialDocumentContent); - // this.initialDocumentContent.valueHasMutated(); setSelectedDocumentContent(selectedDocumentContentBaseline); - // setEditorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits); - }, [ - initialDocumentContent, - selectedDocumentContentBaseline, - setSelectedDocumentContent, - // setEditorState, - ]); + }, [initialDocumentContent, selectedDocumentContentBaseline, setSelectedDocumentContent]); /** * Implementation using bulk delete @@ -848,7 +819,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ const newDocumentIds = [...documentIds]; deletedIds.forEach((deletedId) => { if (deletedId !== undefined) { - // documentIds.remove((documentId: DocumentId) => documentId.rid === selectedDocumentId.rid); const index = toDeleteDocumentIds.findIndex((documentId) => documentId.rid === deletedId); if (index !== -1) { newDocumentIds.splice(index, 1); @@ -868,8 +838,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ ); const onDeleteExistingDocumentsClick = useCallback(async (): Promise => { - // const selectedDocumentId = this.selectedDocumentId(); - // TODO: Rework this for localization const isPlural = selectedRows.size > 1; const documentName = !isPreferredApiMongoDB @@ -881,19 +849,19 @@ const DocumentsTabComponent: React.FunctionComponent<{ : "the selected document"; const msg = `Are you sure you want to delete ${documentName}?`; - useDialog.getState().showOkCancelModalDialog( - "Confirm delete", - msg, - "Delete", - // async () => await _deleteDocuments(selectedDocumentId), - () => deleteDocuments(Array.from(selectedRows).map((index) => documentIds[index as number])), - "Cancel", - undefined, - ); + useDialog + .getState() + .showOkCancelModalDialog( + "Confirm delete", + msg, + "Delete", + () => deleteDocuments(Array.from(selectedRows).map((index) => documentIds[index as number])), + "Cancel", + undefined, + ); }, [deleteDocuments, documentIds, isPreferredApiMongoDB, selectedRows]); // If editor state changes, update the nav - // TODO Put whatever the buttons callback use in the dependency array: find a better way to maintain useEffect( () => updateNavbarWithTabsButtons(isTabActive, { @@ -952,35 +920,18 @@ const DocumentsTabComponent: React.FunctionComponent<{ return isQueryCopilotSampleContainer ? querySampleDocuments(query, options) : queryDocuments(_collection.databaseId, _collection.id(), query, options); - }, [isPreferredApiMongoDB, filterContent, resourceTokenPartitionKey, isQueryCopilotSampleContainer, _collection]); - - /** - * Query first page of documents - * Select and query first document and display content - */ - // const autoPopulateContent = async (applyFilterButtonPressed?: boolean) => { - // // reset iterator - // setDocumentsIterator({ - // iterator: createIterator(), - // applyFilterButtonPressed, - // }); - // // load documents - // await loadNextPage(applyFilterButtonPressed); - - // // // Select first document and load content - // // if (documentIds.length > 0) { - // // documentIds[0].click(); - // // } - // }; + }, [ + filterContent, + isPreferredApiMongoDB, + partitionKeyProperties, + partitionKey, + resourceTokenPartitionKey, + isQueryCopilotSampleContainer, + _collection, + ]); const onHideFilterClick = (): void => { setIsFilterExpanded(false); - - // this.isFilterExpanded(false); - - // $(".filterDocExpanded").removeClass("active"); - // $("#content").removeClass("active"); - // $(".queryButton").focus(); }; const onCloseButtonKeyDown: KeyboardEventHandler = (event) => { @@ -992,26 +943,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ return true; }; - // const accessibleDocumentList = new AccessibleVerticalList(documentIds); - // accessibleDocumentList.setOnSelect( - // (selectedDocument: DocumentId) => selectedDocument && selectedDocument.click(), - // ); - // this.selectedDocumentId.subscribe((newSelectedDocumentId: DocumentId) => - // accessibleDocumentList.updateCurrentItem(newSelectedDocumentId), - // ); - // this.documentIds.subscribe((newDocuments: DocumentId[]) => { - // accessibleDocumentList.updateItemList(newDocuments); - // if (newDocuments.length > 0) { - // this.dataContentsGridScrollHeight( - // newDocuments.length * DocumentsGridMetrics.IndividualRowHeight + DocumentsGridMetrics.BufferHeight + "px", - // ); - // } else { - // this.dataContentsGridScrollHeight( - // DocumentsGridMetrics.IndividualRowHeight + DocumentsGridMetrics.BufferHeight + "px", - // ); - // } - // }); - let loadNextPage = useCallback( (iterator: QueryIterator, applyFilterButtonClicked?: boolean): Promise => { setIsExecuting(true); @@ -1056,7 +987,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ .map((rawDocument: DataModels.DocumentId & { _partitionKeyValue: string[] }) => { const partitionKeyValue = rawDocument._partitionKeyValue; - // TODO: Mock documentsTab. Fix this const partitionKey = _partitionKey || (_collection && _collection.partitionKey); const partitionKeyPropertyHeaders = _collection?.partitionKeyPropertyHeaders || partitionKey?.paths; const partitionKeyProperties = partitionKeyPropertyHeaders?.map((partitionKeyPropertyHeader) => @@ -1076,7 +1006,7 @@ const DocumentsTabComponent: React.FunctionComponent<{ collectionName: _collection.id(), dataExplorerArea: Constants.Areas.Tab, - tabTitle, //tabTitle(), + tabTitle, }, onLoadStartKey, ); @@ -1095,7 +1025,7 @@ const DocumentsTabComponent: React.FunctionComponent<{ collectionName: _collection.id(), dataExplorerArea: Constants.Areas.Tab, - tabTitle, // tabTitle(), + tabTitle, error: errorMessage, errorStack: getErrorStack(error), }, @@ -1135,8 +1065,7 @@ const DocumentsTabComponent: React.FunctionComponent<{ loadNextPage(documentsIterator.iterator, documentsIterator.applyFilterButtonPressed); } }, [ - documentsIterator, - // loadNextPage: disabled as it will trigger a circular dependency and infinite loop + documentsIterator, // loadNextPage: disabled as it will trigger a circular dependency and infinite loop ]); const onRefreshKeyInput: KeyboardEventHandler = (event) => { @@ -1473,7 +1402,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ const value: string = renderObjectForEditor(savedDocument || {}, null, 4); setSelectedDocumentContentBaseline(value); - // this.selectedDocumentId(id); setDocumentIds(ids); setEditorState(ViewModels.DocumentExplorerState.exisitingDocumentNoEdits); TelemetryProcessor.traceSuccess( @@ -1515,7 +1443,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ ]); onSaveExistingDocumentClick = (): Promise => { - // const selectedDocumentId = this.selectedDocumentId(); const documentContent = selectedDocumentContent; onExecutionErrorChange(false); setIsExecuting(true); @@ -1608,14 +1535,12 @@ const DocumentsTabComponent: React.FunctionComponent<{ const merged = currentDocuments.concat(nextDocumentIds); setDocumentIds(merged); - // currentDocuments = this.documentIds();/ currentDocuments = merged; if (filterContent.length > 0 && currentDocuments.length > 0) { currentDocuments[0].click(); } else { setSelectedDocumentContent(""); - // this.selectedDocumentId(null); setEditorState(ViewModels.DocumentExplorerState.noDocumentSelected); } if (_onLoadStartKey !== null && _onLoadStartKey !== undefined) { @@ -1630,8 +1555,7 @@ const DocumentsTabComponent: React.FunctionComponent<{ }, _onLoadStartKey, ); - // TODO: Set on Load start key to null to stop telemetry traces - setOnLoadStartKey(null); + setOnLoadStartKey(undefined); } }, // eslint-disable-next-line @typescript-eslint/no-explicit-any @@ -1650,7 +1574,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ }, _onLoadStartKey, ); - // TODO: Set on Load start key to null to stop telemetry traces setOnLoadStartKey(undefined); } }, @@ -1665,10 +1588,7 @@ const DocumentsTabComponent: React.FunctionComponent<{ // clear documents grid setDocumentIds([]); try { - // reset iterator - // setDocumentsIterator(createIterator()); - // load documents - // await autoPopulateContent(applyFilterButtonPressed); + // reset iterator which will autoload documents (in useEffect) setDocumentsIterator({ iterator: createIterator(), applyFilterButtonPressed, @@ -1688,71 +1608,33 @@ const DocumentsTabComponent: React.FunctionComponent<{ return ( -
- {/* */} +
{isFilterCreated && ( -
- {/* */} +
{!isFilterExpanded && !isPreferredApiMongoDB && ( -
+
SELECT * FROM c - {appliedFilter} -
)} {!isFilterExpanded && isPreferredApiMongoDB && ( -
- {appliedFilter.length > 0 && ( - Filter : - )} - {!(appliedFilter.length > 0) && ( - - No filter applied - - )} - {appliedFilter} -
)} - {/* */} - - {/* */} {isFilterExpanded && ( -
+
- {!isPreferredApiMongoDB && ( - - {" "} - SELECT * FROM c{" "} - - )} + {!isPreferredApiMongoDB && SELECT * FROM c } setFilterContent(e.target.value)} - /* - data-bind=" - W attr:{ - placeholder:isPreferredApiMongoDB?'Type a query predicate (e.g., {´a´:´foo´}), or choose one from the drop down list, or leave empty to query all documents.':'Type a query predicate (e.g., WHERE c.id=´1´), or choose one from the drop down list, or leave empty to query all documents.' - }, - css: { placeholderVisible: filterContent().length === 0 }, - textInput: filterContent" - */ /> - + {lastFilterContents.map((filter) => ( - @@ -1788,10 +1662,6 @@ const DocumentsTabComponent: React.FunctionComponent<{ style={filterButtonStyle} onClick={() => refreshDocumentsGrid(true)} disabled={!applyFilterButton.enabled} - /* data-bind=" - click: refreshDocumentsGrid.bind($data, true), - enable: applyFilterButton.enabled" - */ aria-label="Apply filter" tabIndex={0} > @@ -1803,10 +1673,6 @@ const DocumentsTabComponent: React.FunctionComponent<{
)} - {/* */}
)} - {/* */} - {/* doesn't like to be a flex child */}