Skip to content

Commit

Permalink
ui: remove unnecessary uses of lodash in database pages
Browse files Browse the repository at this point in the history
Closes #68820

This commit removes the ue of functions from the lodash function
where regular JS can be used.

Release note: None
  • Loading branch information
xinhaoz committed Mar 21, 2022
1 parent b3525c9 commit 68d9b53
Show file tree
Hide file tree
Showing 6 changed files with 47 additions and 54 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import {
} from "src/storybook/fixtures";
import {
DatabaseDetailsPage,
DatabaseDetailsPageDataTable,
DatabaseDetailsPageProps,
ViewMode,
} from "./databaseDetailsPage";
Expand Down Expand Up @@ -86,41 +87,40 @@ const withoutData: DatabaseDetailsPageProps = {
},
};

function createTable(): DatabaseDetailsPageDataTable {
const roles = _.uniq(new Array(_.random(1, 3)).map(() => randomRole()));
const grants = _.uniq(
new Array(_.random(1, 5)).map(() => randomTablePrivilege()),
);

return {
name: randomName(),
details: {
loading: false,
loaded: true,
columnCount: _.random(5, 42),
indexCount: _.random(1, 6),
userCount: roles.length,
roles: roles,
grants: grants,
statsLastUpdated: moment("0001-01-01T00:00:00Z"),
},
stats: {
loading: false,
loaded: true,
replicationSizeInBytes: _.random(1000.0) * 1024 ** _.random(1, 2),
rangeCount: _.random(50, 500),
nodesByRegionString:
"gcp-europe-west1(n8), gcp-us-east1(n1), gcp-us-west1(n6)",
},
};
}

const withData: DatabaseDetailsPageProps = {
loading: false,
loaded: true,
name: randomName(),
tables: _.map(Array(42), _item => {
const roles = _.uniq(
_.map(new Array(_.random(1, 3)), _item => randomRole()),
);
const grants = _.uniq(
_.map(new Array(_.random(1, 5)), _item => randomTablePrivilege()),
);

return {
name: randomName(),
details: {
loading: false,
loaded: true,
columnCount: _.random(5, 42),
indexCount: _.random(1, 6),
userCount: roles.length,
roles: roles,
grants: grants,
statsLastUpdated: moment("0001-01-01T00:00:00Z"),
},
showNodeRegionsColumn: true,
stats: {
loading: false,
loaded: true,
replicationSizeInBytes: _.random(1000.0) * 1024 ** _.random(1, 2),
rangeCount: _.random(50, 500),
nodesByRegionString:
"gcp-europe-west1(n8), gcp-us-east1(n1), gcp-us-west1(n6)",
},
};
}),
tables: [createTable()],
viewMode: ViewMode.Tables,
sortSettingTables: {
ascending: false,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,6 @@ import React from "react";
import { Link, RouteComponentProps } from "react-router-dom";
import { Tooltip } from "antd";
import classNames from "classnames/bind";
import _ from "lodash";

import { Breadcrumbs } from "src/breadcrumbs";
import { Dropdown, DropdownOption } from "src/dropdown";
import { CaretRight } from "src/icon/caretRight";
Expand Down Expand Up @@ -203,7 +201,7 @@ export class DatabaseDetailsPage extends React.Component<
return this.props.refreshDatabaseDetails(this.props.name);
}

_.forEach(this.props.tables, table => {
this.props.tables.forEach(table => {
if (!table.details.loaded && !table.details.loading) {
return this.props.refreshTableDetails(this.props.name, table.name);
}
Expand Down Expand Up @@ -417,8 +415,8 @@ export class DatabaseDetailsPage extends React.Component<
Roles
</Tooltip>
),
cell: table => _.join(table.details.roles, ", "),
sort: table => _.join(table.details.roles, ", "),
cell: table => table.details.roles.join(", "),
sort: table => table.details.roles.join(", "),
className: cx("database-table__col-roles"),
name: "roles",
},
Expand All @@ -428,8 +426,8 @@ export class DatabaseDetailsPage extends React.Component<
Grants
</Tooltip>
),
cell: table => _.join(table.details.grants, ", "),
sort: table => _.join(table.details.grants, ", "),
cell: table => table.details.grants.join(", "),
sort: table => table.details.grants.join(", "),
className: cx("database-table__col-grants"),
name: "grants",
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@

import React from "react";
import { storiesOf } from "@storybook/react";
import _ from "lodash";

import { withBackground, withRouterProvider } from "src/storybook/decorators";
import {
Expand Down Expand Up @@ -84,15 +83,13 @@ const withData: DatabaseTablePageProps = {
)
`,
replicaCount: 7,
indexNames: _.map(Array(3), randomName),
grants: _.uniq(
_.map(Array(12), () => {
return {
user: randomRole(),
privilege: randomTablePrivilege(),
};
}),
),
indexNames: Array(3).map(randomName),
grants: [
{
user: randomRole(),
privilege: randomTablePrivilege(),
},
],
statsLastUpdated: moment("0001-01-01T00:00:00Z"),
},
showNodeRegionsSection: true,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@ import React from "react";
import { Col, Row, Tabs } from "antd";
import { RouteComponentProps } from "react-router-dom";
import classNames from "classnames/bind";
import _ from "lodash";
import { Tooltip } from "antd";
import { Heading } from "@cockroachlabs/ui-components";

Expand Down Expand Up @@ -421,7 +420,7 @@ export class DatabaseTablePage extends React.Component<
/>
<SummaryCardItem
label="Indexes"
value={_.join(this.props.details.indexNames, ", ")}
value={this.props.details.indexNames.join(", ")}
className={cx("database-table-page__indexes--value")}
/>
</SummaryCard>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ const withData: DatabasesPageProps = {
ascending: false,
columnTitle: "name",
},
databases: _.map(Array(42), _item => {
databases: Array(42).map(() => {
return {
loading: false,
loaded: true,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@ import React from "react";
import { Link, RouteComponentProps } from "react-router-dom";
import { Tooltip } from "antd";
import classNames from "classnames/bind";
import _ from "lodash";

import { Anchor } from "src/anchor";
import { StackIcon } from "src/icon/stackIcon";
Expand Down Expand Up @@ -175,12 +174,12 @@ export class DatabasesPage extends React.Component<
return this.props.refreshDatabases();
}

_.forEach(this.props.databases, database => {
this.props.databases.forEach(database => {
if (!database.loaded && !database.loading) {
return this.props.refreshDatabaseDetails(database.name);
}

_.forEach(database.missingTables, table => {
database.missingTables.forEach(table => {
if (!table.loading) {
return this.props.refreshTableStats(database.name, table.name);
}
Expand Down

0 comments on commit 68d9b53

Please sign in to comment.