jayeshchoudhary commented on code in PR #12210:
URL: https://github.com/apache/pinot/pull/12210#discussion_r1442853339
##########
pinot-controller/src/main/resources/app/pages/Tenants.tsx:
##########
@@ -17,84 +17,59 @@
* under the License.
*/
-import React, { useState, useEffect } from 'react';
+import React from 'react';
import { Grid, makeStyles } from '@material-ui/core';
-import { TableData } from 'Models';
+import { InstanceType } from 'Models';
import { RouteComponentProps } from 'react-router-dom';
-import CustomizedTables from '../components/Table';
-import AppLoader from '../components/AppLoader';
-import PinotMethodUtils from '../utils/PinotMethodUtils';
import SimpleAccordion from '../components/SimpleAccordion';
+import AsyncPinotTables from '../components/AsyncPinotTables';
import CustomButton from '../components/CustomButton';
+import { AsyncInstanceTable } from '../components/AsyncInstanceTable';
const useStyles = makeStyles((theme) => ({
operationDiv: {
border: '1px #BDCCD9 solid',
borderRadius: 4,
- marginBottom: 20
- }
+ marginBottom: 20,
+ },
}));
type Props = {
- tenantName: string
+ tenantName: string;
};
-const TableTooltipData = [
- null,
- "Uncompressed size of all data segments with replication",
- "Estimated size of all data segments with replication, in case any servers
are not reachable for actual size",
- null,
- "GOOD if all replicas of all segments are up"
-];
-
const TenantPage = ({ match }: RouteComponentProps<Props>) => {
-
- const {tenantName} = match.params;
- const columnHeaders = ['Table Name', 'Reported Size', 'Estimated Size',
'Number of Segments', 'Status'];
- const [fetching, setFetching] = useState(true);
- const [tableData, setTableData] = useState<TableData>({
- columns: columnHeaders,
- records: []
- });
- const [brokerData, setBrokerData] = useState(null);
- const [serverData, setServerData] = useState([]);
-
- const fetchData = async () => {
- const tenantData = await PinotMethodUtils.getTenantTableData(tenantName);
- const brokersData = await PinotMethodUtils.getBrokerOfTenant(tenantName);
- const serversData = await PinotMethodUtils.getServerOfTenant(tenantName);
- setTableData(tenantData);
- const separatedBrokers = Array.isArray(brokersData) ?
brokersData.map((elm) => [elm]) : [];
- setBrokerData(separatedBrokers || []);
- const separatedServers = Array.isArray(serversData) ?
serversData.map((elm) => [elm]) : [];
- setServerData(separatedServers || []);
- setFetching(false);
- };
- useEffect(() => {
- fetchData();
- }, []);
-
+ const { tenantName } = match.params;
const classes = useStyles();
return (
- fetching ? <AppLoader /> :
- <Grid item xs style={{ padding: 20, backgroundColor: 'white', maxHeight:
'calc(100vh - 70px)', overflowY: 'auto' }}>
+ <Grid
+ item
+ xs
+ style={{
+ padding: 20,
+ backgroundColor: 'white',
+ maxHeight: 'calc(100vh - 70px)',
+ overflowY: 'auto',
+ }}
+ >
<div className={classes.operationDiv}>
- <SimpleAccordion
- headerTitle="Operations"
- showSearchBox={false}
- >
+ <SimpleAccordion headerTitle="Operations" showSearchBox={false}>
<div>
<CustomButton
- onClick={()=>{console.log('rebalance');}}
+ onClick={() => {
+ console.log('rebalance');
+ }}
tooltipTitle="Recalculates the segment to server mapping for all
tables in this tenant"
enableTooltip={true}
isDisabled={true}
>
Rebalance Server Tenant
</CustomButton>
<CustomButton
- onClick={()=>{console.log('rebuild');}}
+ onClick={() => {
+ console.log('rebuild');
+ }}
Review Comment:
remove logs
##########
pinot-controller/src/main/resources/app/pages/Tenants.tsx:
##########
@@ -17,84 +17,59 @@
* under the License.
*/
-import React, { useState, useEffect } from 'react';
+import React from 'react';
import { Grid, makeStyles } from '@material-ui/core';
-import { TableData } from 'Models';
+import { InstanceType } from 'Models';
import { RouteComponentProps } from 'react-router-dom';
-import CustomizedTables from '../components/Table';
-import AppLoader from '../components/AppLoader';
-import PinotMethodUtils from '../utils/PinotMethodUtils';
import SimpleAccordion from '../components/SimpleAccordion';
+import AsyncPinotTables from '../components/AsyncPinotTables';
import CustomButton from '../components/CustomButton';
+import { AsyncInstanceTable } from '../components/AsyncInstanceTable';
const useStyles = makeStyles((theme) => ({
operationDiv: {
border: '1px #BDCCD9 solid',
borderRadius: 4,
- marginBottom: 20
- }
+ marginBottom: 20,
+ },
}));
type Props = {
- tenantName: string
+ tenantName: string;
};
-const TableTooltipData = [
- null,
- "Uncompressed size of all data segments with replication",
- "Estimated size of all data segments with replication, in case any servers
are not reachable for actual size",
- null,
- "GOOD if all replicas of all segments are up"
-];
-
const TenantPage = ({ match }: RouteComponentProps<Props>) => {
-
- const {tenantName} = match.params;
- const columnHeaders = ['Table Name', 'Reported Size', 'Estimated Size',
'Number of Segments', 'Status'];
- const [fetching, setFetching] = useState(true);
- const [tableData, setTableData] = useState<TableData>({
- columns: columnHeaders,
- records: []
- });
- const [brokerData, setBrokerData] = useState(null);
- const [serverData, setServerData] = useState([]);
-
- const fetchData = async () => {
- const tenantData = await PinotMethodUtils.getTenantTableData(tenantName);
- const brokersData = await PinotMethodUtils.getBrokerOfTenant(tenantName);
- const serversData = await PinotMethodUtils.getServerOfTenant(tenantName);
- setTableData(tenantData);
- const separatedBrokers = Array.isArray(brokersData) ?
brokersData.map((elm) => [elm]) : [];
- setBrokerData(separatedBrokers || []);
- const separatedServers = Array.isArray(serversData) ?
serversData.map((elm) => [elm]) : [];
- setServerData(separatedServers || []);
- setFetching(false);
- };
- useEffect(() => {
- fetchData();
- }, []);
-
+ const { tenantName } = match.params;
const classes = useStyles();
return (
- fetching ? <AppLoader /> :
- <Grid item xs style={{ padding: 20, backgroundColor: 'white', maxHeight:
'calc(100vh - 70px)', overflowY: 'auto' }}>
+ <Grid
+ item
+ xs
+ style={{
+ padding: 20,
+ backgroundColor: 'white',
+ maxHeight: 'calc(100vh - 70px)',
+ overflowY: 'auto',
+ }}
+ >
<div className={classes.operationDiv}>
- <SimpleAccordion
- headerTitle="Operations"
- showSearchBox={false}
- >
+ <SimpleAccordion headerTitle="Operations" showSearchBox={false}>
<div>
<CustomButton
- onClick={()=>{console.log('rebalance');}}
+ onClick={() => {
+ console.log('rebalance');
+ }}
Review Comment:
remove logs
##########
pinot-controller/src/main/resources/app/pages/InstanceListingPage.tsx:
##########
@@ -38,13 +39,12 @@ const InstanceListingPage = () => {
const classes = useStyles();
const [fetching, setFetching] = useState(true);
- const [instances, setInstances] = useState<DataTable>();
+ // const [instances, setInstances] = useState<DataTable>();
const [clusterName, setClusterName] = useState('');
const fetchData = async () => {
- const instanceResponse = await PinotMethodUtils.getAllInstances();
- const instanceType = startCase(window.location.hash.split('/')[1].slice(0,
-1));
- setInstances(pick(instanceResponse, instanceType));
+ // const instanceResponse = await PinotMethodUtils.getAllInstances();
+ // setInstances(pick(instanceResponse, instanceType));
Review Comment:
remove unwanted comments
##########
pinot-controller/src/main/resources/app/utils/PinotMethodUtils.ts:
##########
@@ -141,6 +141,10 @@ const getTenantsData = () => {
});
};
+const getTenantData = (tenant: string) => {
+
+}
+
Review Comment:
empty function?
##########
pinot-controller/src/main/resources/app/pages/SchemaPageDetails.tsx:
##########
@@ -204,143 +222,146 @@ const SchemaPageDetails = ({ match }:
RouteComponentProps<Props>) => {
const handleSegmentDialogHide = () => {
setShowEditConfig(false);
setReloadSegmentsOnUpdate(false);
- }
+ };
- return fetching ? (
- <AppLoader />
- ) : (
- <Grid
- item
- xs
- style={{
- padding: 20,
- backgroundColor: 'white',
- maxHeight: 'calc(100vh - 70px)',
- overflowY: 'auto',
- }}
- >
- <div className={classes.operationDiv}>
- <SimpleAccordion
- headerTitle="Operations"
- showSearchBox={false}
- >
- <div>
- <CustomButton
- onClick={()=>{
- setActionType('editSchema');
- setConfig(JSON.stringify(schemaJSON, null, 2));
- setShowEditConfig(true);
- }}
- tooltipTitle="Edit Schema"
- enableTooltip={true}
- >
- Edit Schema
- </CustomButton>
- <CustomButton
- isDisabled={!schemaJSON} onClick={handleDeleteSchemaAction}
- tooltipTitle="Delete Schema"
- enableTooltip={true}
- >
- Delete Schema
- </CustomButton>
+ if (fetching) {
+ return <AppLoader />;
+ } else if (schemaNotFound) {
+ return <NotFound message={`Schema ${schemaName} not found`} />;
+ } else {
+ return (
+ <Grid
+ item
Review Comment:
minor nit: if you are returning from if then it can just be
```js
if(condition1) {
return 1;
}
if(condition2) {
return 2;
}
return default;
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
