diff --git a/app/client/src/components/designSystems/appsmith/Table.tsx b/app/client/src/components/designSystems/appsmith/Table.tsx
index a206573220..37544cc2c4 100644
--- a/app/client/src/components/designSystems/appsmith/Table.tsx
+++ b/app/client/src/components/designSystems/appsmith/Table.tsx
@@ -15,6 +15,12 @@ import { TableHeaderCell, renderEmptyRows } from "./TableUtilities";
import TableHeader from "./TableHeader";
import { Classes } from "@blueprintjs/core";
+export enum TABLE_SIZES {
+ COLUMN_HEADER_HEIGHT = 52,
+ TABLE_HEADER_HEIGHT = 61,
+ ROW_HEIGHT = 52,
+}
+
interface TableProps {
width: number;
height: number;
@@ -145,9 +151,20 @@ export const Table = (props: TableProps) => {
))}
{headerGroups.length === 0 &&
- renderEmptyRows(1, props.columns, props.width)}
+ renderEmptyRows(
+ 1,
+ props.columns,
+ props.width,
+ subPage,
+ prepareRow,
+ )}
-
+
subPage.length ? "no-scroll" : ""
+ }`}
+ >
{subPage.map((row, rowIndex) => {
prepareRow(row);
return (
@@ -168,8 +185,6 @@ export const Table = (props: TableProps) => {
{cell.render("Cell")}
@@ -184,6 +199,8 @@ export const Table = (props: TableProps) => {
props.pageSize - subPage.length,
props.columns,
props.width,
+ subPage,
+ prepareRow,
)}
diff --git a/app/client/src/components/designSystems/appsmith/TableStyledWrappers.tsx b/app/client/src/components/designSystems/appsmith/TableStyledWrappers.tsx
index 706cfc37bf..d5f68a22e2 100644
--- a/app/client/src/components/designSystems/appsmith/TableStyledWrappers.tsx
+++ b/app/client/src/components/designSystems/appsmith/TableStyledWrappers.tsx
@@ -1,5 +1,6 @@
import styled from "styled-components";
import { Colors } from "constants/Colors";
+import { TABLE_SIZES } from "components/designSystems/appsmith/Table";
export const TableWrapper = styled.div<{ width: number; height: number }>`
width: ${props => props.width - 5}px;
@@ -26,7 +27,18 @@ export const TableWrapper = styled.div<{ width: number; height: number }>`
}
.tbody {
overflow: scroll;
- height: ${props => props.height - 5 - 102}px;
+ /*
+ Here 5px is subtracted to compensate padding from widget resizers and
+ 113px to compensate table column header and table header heights
+ */
+ height: ${props =>
+ props.height -
+ 5 -
+ TABLE_SIZES.TABLE_HEADER_HEIGHT -
+ TABLE_SIZES.COLUMN_HEADER_HEIGHT}px;
+ &.no-scroll {
+ overflow: hidden;
+ }
}
.tr {
:nth-child(even) {
diff --git a/app/client/src/components/designSystems/appsmith/TableUtilities.tsx b/app/client/src/components/designSystems/appsmith/TableUtilities.tsx
index c82ec4985e..aff1054514 100644
--- a/app/client/src/components/designSystems/appsmith/TableUtilities.tsx
+++ b/app/client/src/components/designSystems/appsmith/TableUtilities.tsx
@@ -480,8 +480,25 @@ export const renderEmptyRows = (
rowCount: number,
columns: any,
tableWidth: number,
+ page: any,
+ prepareRow: any,
) => {
const rows: string[] = new Array(rowCount).fill("");
+ if (page.length) {
+ const row = page[0];
+ return rows.map((item: string, index: number) => {
+ prepareRow(row);
+ return (
+
+ {row.cells.map((cell: any, cellIndex: number) => {
+ return (
+
+ );
+ })}
+
+ );
+ });
+ }
const tableColumns = columns.length
? columns
: new Array(3).fill({ width: tableWidth / 3, isHidden: false });
diff --git a/app/client/src/pages/Applications/CreateApplicationForm.tsx b/app/client/src/pages/Applications/CreateApplicationForm.tsx
index d8696bf1d6..031502f102 100644
--- a/app/client/src/pages/Applications/CreateApplicationForm.tsx
+++ b/app/client/src/pages/Applications/CreateApplicationForm.tsx
@@ -37,7 +37,7 @@ export const CreateApplicationForm = (props: Props) => {
onSubmit={handleSubmit(createApplicationFormSubmitHandler)}
divider
submitOnEnter
- data-cy = "t--create-app-submit"
+ data-cy="t--create-app-submit"
submitText="Submit"
size="small"
submitting={submitting && !error}
diff --git a/app/client/src/pages/Applications/index.tsx b/app/client/src/pages/Applications/index.tsx
index db0e19ff38..8e280be7ef 100644
--- a/app/client/src/pages/Applications/index.tsx
+++ b/app/client/src/pages/Applications/index.tsx
@@ -57,8 +57,8 @@ const ApplicationCardsWrapper = styled.div`
font-size: ${props => props.theme.fontSizes[4]}px;
`;
-const OrgSection = styled.div``
-
+const OrgSection = styled.div``;
+
const OrgName = styled.div`
display: flex;
font-size: ${props => props.theme.fontSizes[3]}px;
@@ -213,11 +213,11 @@ class Applications extends Component<
{this.props.userOrgs &&
this.props.userOrgs.length !== 0 &&
- this.props.userOrgs.map((organizationObject: any) => {
+ this.props.userOrgs.map((organizationObject: any, index: number) => {
const { organization, applications } = organizationObject;
return (
-
+
{!isPermitted(
organization.userPermissions,
PERMISSION_TYPE.MANAGE_ORGANIZATION,
@@ -260,7 +260,12 @@ class Applications extends Component<
+
}
Form={InviteUsersFormv2}
orgId={organization.id}
diff --git a/app/client/src/pages/common/PageNotFound.tsx b/app/client/src/pages/common/PageNotFound.tsx
index 597cff16d5..e34f5c34c7 100644
--- a/app/client/src/pages/common/PageNotFound.tsx
+++ b/app/client/src/pages/common/PageNotFound.tsx
@@ -35,7 +35,8 @@ class PageNotFound extends React.PureComponent {
Page not found
- Either this page doesn't exist, or you don't have access to
+ Either this page doesn't exist, or you don't have access
+ to
this page.
{
super.updateWidgetMetaProperty("pageNo", pageNo);
}
const { componentWidth, componentHeight } = this.getComponentDimensions();
- const pageSize = Math.floor((componentHeight - 104) / 52);
+ const pageSize = Math.floor(
+ (componentHeight -
+ TABLE_SIZES.TABLE_HEADER_HEIGHT -
+ TABLE_SIZES.COLUMN_HEADER_HEIGHT) /
+ TABLE_SIZES.ROW_HEIGHT,
+ );
if (pageSize !== this.props.pageSize) {
super.updateWidgetMetaProperty("pageSize", pageSize);