App Edit top bar (#232)
This commit is contained in:
Hetu Nandu
GitHub
parent
bca3787f78
commit
955e9a2f2b
|
|
@ -29,7 +29,7 @@ describe("Button Widget Functionality", function() {
|
|||
cy.EvaluateDataType("string");
|
||||
cy.EvaluateCurrentValue(this.data.ButtonLabel);
|
||||
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
|
||||
//Verify the Button name and label
|
||||
cy.get(widgetsPage.buttonWidget).trigger("mouseover");
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
"deleteButton":".bp3-menu-item.bp3-popover-dismiss",
|
||||
"selectAction":"#Base",
|
||||
"deleteApp":".bp3-menu-item",
|
||||
"homeIcon": ".bp3-icon-home",
|
||||
"homeIcon": ".t--appsmith-logo",
|
||||
"inputAppName": "input[name=applicationName]",
|
||||
"createNew": ".createnew",
|
||||
"createOrg": "button:contains('Create Organization')",
|
||||
|
|
@ -39,4 +39,4 @@
|
|||
"shareOrg": ") .bp3-button-text:contains('Share')",
|
||||
"orgSection": ".bp3-button-text:contains(",
|
||||
"createAppFrOrg": ") .t--create-app-popup"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
"scrollView": ".t--property-control-scrollcontents input",
|
||||
"InputforText": ".t--property-control-text .CodeMirror-code",
|
||||
"TextInside": ".bp3-ui-text span",
|
||||
"homeIcon": ".bp3-icon.bp3-icon-home",
|
||||
"homeIcon": ".t--appsmith-logo",
|
||||
"typeWidgetName": ".bp3-editable-text-editing>input",
|
||||
"requiredCheckbox": ".t--property-control-required input[type='checkbox']",
|
||||
"visibleCheckbox": ".t--property-control-visible input[type='checkbox']",
|
||||
|
|
@ -57,5 +57,9 @@
|
|||
"singleSelectMenuItem": ".bp3-menu-item.single-select div",
|
||||
"selectMenuItem": ".bp3-menu li>a>div",
|
||||
"evaluatedType": ".t--CodeEditor-evaluatedValue>pre",
|
||||
"evaluatedCurrentValue": ".t--CodeEditor-evaluatedValue div pre"
|
||||
}
|
||||
"evaluatedCurrentValue": ".t--CodeEditor-evaluatedValue div pre",
|
||||
"saveStatusContainer": ".t--save-status-container",
|
||||
"saveStatusIsSaving": "t--save-status-is-saving",
|
||||
"saveStatusSuccess": ".t--save-status-success",
|
||||
"saveStatusError": ".t--save-status-error"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -629,7 +629,7 @@ Cypress.Commands.add("createModal", (modalType, ModalName) => {
|
|||
.children()
|
||||
.contains(modalType)
|
||||
.click();
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
|
||||
// changing the model name verify
|
||||
cy.widgetText(
|
||||
|
|
@ -650,21 +650,21 @@ Cypress.Commands.add("createModal", (modalType, ModalName) => {
|
|||
cy.get(widgetsPage.textAlign + " .bp3-menu-item")
|
||||
.contains("Center")
|
||||
.click();
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
});
|
||||
|
||||
Cypress.Commands.add("CheckWidgetProperties", checkboxCss => {
|
||||
cy.get(checkboxCss).check({
|
||||
force: true,
|
||||
});
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
});
|
||||
|
||||
Cypress.Commands.add("UncheckWidgetProperties", checkboxCss => {
|
||||
cy.get(checkboxCss).uncheck({
|
||||
force: true,
|
||||
});
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
});
|
||||
|
||||
Cypress.Commands.add(
|
||||
|
|
@ -708,7 +708,7 @@ Cypress.Commands.add("PublishtheApp", () => {
|
|||
cy.route("POST", "/api/v1/applications/publish/*").as("publishApp");
|
||||
// Wait before publish
|
||||
cy.wait(2000);
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
cy.get(homePage.publishButton).click();
|
||||
cy.wait("@publishApp");
|
||||
cy.get('a[class="bp3-button"]')
|
||||
|
|
@ -781,14 +781,14 @@ Cypress.Commands.add("SetDateToToday", () => {
|
|||
cy.get(formWidgetsPage.datepickerFooter)
|
||||
.contains("Today")
|
||||
.click();
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
});
|
||||
|
||||
Cypress.Commands.add("ClearDate", () => {
|
||||
cy.get(formWidgetsPage.datepickerFooter)
|
||||
.contains("Clear")
|
||||
.click();
|
||||
cy.xpath(homePage.homePageID).contains("All changes saved");
|
||||
cy.assertPageSave();
|
||||
});
|
||||
|
||||
Cypress.Commands.add("DeleteModal", () => {
|
||||
|
|
@ -1453,3 +1453,7 @@ Cypress.Commands.add("callApi", apiname => {
|
|||
.contains(apiname)
|
||||
.click();
|
||||
});
|
||||
|
||||
Cypress.Commands.add("assertPageSave", () => {
|
||||
cy.get(commonlocators.saveStatusSuccess);
|
||||
});
|
||||
|
|
|
|||
4
app/client/src/assets/icons/header/deploy.svg
Normal file
4
app/client/src/assets/icons/header/deploy.svg
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7882 1.21167C12.7882 1.21167 8.45354 1.20153 5.07423 4.58084C4.92151 4.7353 4.78259 4.90281 4.65905 5.08146C4.05995 5.03367 3.14174 5.05105 2.67347 5.52029C1.57761 6.61615 1.21216 8.44291 1.21216 8.44291L3.76788 8.07795V8.78374L5.21616 10.232H5.92195L5.5565 12.7882C5.5565 12.7882 7.38326 12.4228 8.47912 11.3269C8.94788 10.8582 8.96526 9.94043 8.91795 9.34133C9.09672 9.21794 9.26424 9.07901 9.41857 8.92615C12.7979 5.54684 12.7882 1.21167 12.7882 1.21167ZM7.9703 5.06408C7.96739 4.93551 7.9902 4.80764 8.03739 4.688C8.08457 4.56836 8.15519 4.45936 8.24508 4.36738C8.33498 4.27541 8.44235 4.20232 8.56088 4.15241C8.67941 4.1025 8.80672 4.07677 8.93533 4.07674C9.06394 4.07671 9.19126 4.10237 9.30981 4.15222C9.42837 4.20207 9.53577 4.27511 9.62571 4.36704C9.71565 4.45896 9.78632 4.56794 9.83357 4.68755C9.88082 4.80717 9.90369 4.93502 9.90085 5.0636C9.89527 5.31587 9.79115 5.55594 9.61079 5.7324C9.43042 5.90887 9.18814 6.00771 8.93581 6.00777C8.68348 6.00784 8.44114 5.90911 8.26069 5.73274C8.08024 5.55636 7.976 5.31635 7.9703 5.06408Z" fill="white"/>
|
||||
<path d="M4.13135 10.7201C3.68769 11.1638 3.12528 10.8727 3.12528 10.8727C3.12528 10.8727 2.85107 10.2934 3.27783 9.86663C3.31452 9.82994 3.35942 9.80918 3.40238 9.78408L3.10548 9.48718C2.95052 9.54029 2.80424 9.62429 2.68066 9.74787C2.24714 10.1814 2.27224 11.7257 2.27224 11.7257C2.27224 11.7257 3.81707 11.7504 4.25011 11.3173C4.37369 11.1937 4.45769 11.0475 4.51079 10.8925L4.21438 10.5961C4.18879 10.6386 4.16804 10.6835 4.13135 10.7201Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.6 KiB |
3
app/client/src/assets/icons/header/feedback.svg
Normal file
3
app/client/src/assets/icons/header/feedback.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11.6667 1.16663H2.33341C1.69175 1.16663 1.17258 1.69163 1.17258 2.33329L1.16675 12.8333L3.50008 10.5H11.6667C12.3084 10.5 12.8334 9.97496 12.8334 9.33329V2.33329C12.8334 1.69163 12.3084 1.16663 11.6667 1.16663ZM7.58342 8.16663H6.41675V6.99996H7.58342V8.16663ZM7.58342 5.83329H6.41675V3.49996H7.58342V5.83329Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 438 B |
3
app/client/src/assets/icons/header/save-failure.svg
Normal file
3
app/client/src/assets/icons/header/save-failure.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10 2.5C8.51664 2.5 7.06659 2.93987 5.83323 3.76398C4.59986 4.58809 3.63856 5.75943 3.07091 7.12987C2.50325 8.50032 2.35472 10.0083 2.64411 11.4632C2.9335 12.918 3.64781 14.2544 4.6967 15.3033C5.7456 16.3522 7.08197 17.0665 8.53683 17.3559C9.99168 17.6453 11.4997 17.4967 12.8701 16.9291C14.2406 16.3614 15.4119 15.4001 16.236 14.1668C17.0601 12.9334 17.5 11.4834 17.5 10C17.5 9.01508 17.306 8.03981 16.9291 7.12987C16.5522 6.21993 15.9997 5.39314 15.3033 4.6967C14.6069 4.00026 13.7801 3.44781 12.8701 3.0709C11.9602 2.69399 10.9849 2.5 10 2.5ZM10 13.75C9.85167 13.75 9.70666 13.706 9.58332 13.6236C9.45999 13.5412 9.36386 13.4241 9.30709 13.287C9.25033 13.15 9.23547 12.9992 9.26441 12.8537C9.29335 12.7082 9.36478 12.5746 9.46967 12.4697C9.57456 12.3648 9.7082 12.2933 9.85368 12.2644C9.99917 12.2355 10.15 12.2503 10.287 12.3071C10.4241 12.3639 10.5412 12.46 10.6236 12.5833C10.706 12.7067 10.75 12.8517 10.75 13C10.75 13.1989 10.671 13.3897 10.5303 13.5303C10.3897 13.671 10.1989 13.75 10 13.75ZM10.75 10.75C10.75 10.9489 10.671 11.1397 10.5303 11.2803C10.3897 11.421 10.1989 11.5 10 11.5C9.80109 11.5 9.61032 11.421 9.46967 11.2803C9.32902 11.1397 9.25 10.9489 9.25 10.75V7C9.25 6.80109 9.32902 6.61032 9.46967 6.46967C9.61032 6.32902 9.80109 6.25 10 6.25C10.1989 6.25 10.3897 6.32902 10.5303 6.46967C10.671 6.61032 10.75 6.80109 10.75 7V10.75Z" fill="#F69D2C"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
BIN
app/client/src/assets/icons/header/save-loading.gif
Normal file
BIN
app/client/src/assets/icons/header/save-loading.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
3
app/client/src/assets/icons/header/save-success.svg
Normal file
3
app/client/src/assets/icons/header/save-success.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.0001 1.66663C8.35191 1.66663 6.74074 2.15537 5.37033 3.07105C3.99992 3.98672 2.93182 5.28821 2.30109 6.81093C1.67036 8.33365 1.50533 10.0092 1.82687 11.6257C2.14842 13.2422 2.94209 14.7271 4.10753 15.8925C5.27297 17.058 6.75782 17.8516 8.37433 18.1732C9.99084 18.4947 11.6664 18.3297 13.1891 17.699C14.7118 17.0682 16.0133 16.0001 16.929 14.6297C17.8447 13.2593 18.3334 11.6481 18.3334 9.99996C18.3334 8.90561 18.1179 7.82198 17.6991 6.81093C17.2803 5.79988 16.6665 4.88122 15.8926 4.1074C15.1188 3.33358 14.2002 2.71975 13.1891 2.30096C12.1781 1.88217 11.0944 1.66663 10.0001 1.66663ZM13.5834 8.00829L9.77508 13.0083C9.69745 13.1091 9.59776 13.1909 9.48364 13.2472C9.36952 13.3035 9.24402 13.333 9.11675 13.3333C8.99017 13.334 8.8651 13.3058 8.75104 13.2509C8.63697 13.1961 8.5369 13.1159 8.45842 13.0166L6.42509 10.425C6.35778 10.3385 6.30817 10.2396 6.27907 10.134C6.24998 10.0284 6.24197 9.91806 6.25551 9.80934C6.26906 9.70062 6.30388 9.59563 6.358 9.50036C6.41211 9.4051 6.48446 9.32143 6.57092 9.25413C6.74552 9.1182 6.96696 9.05721 7.18654 9.08456C7.29526 9.0981 7.40025 9.13292 7.49551 9.18704C7.59078 9.24116 7.67445 9.31351 7.74175 9.39996L9.10009 11.1333L12.2501 6.96663C12.3168 6.87908 12.4002 6.80554 12.4954 6.7502C12.5905 6.69486 12.6957 6.65881 12.8048 6.64411C12.9139 6.62941 13.0248 6.63634 13.1313 6.66451C13.2377 6.69268 13.3375 6.74154 13.4251 6.80829C13.5126 6.87505 13.5862 6.95839 13.6415 7.05357C13.6968 7.14875 13.7329 7.25389 13.7476 7.363C13.7623 7.47211 13.7554 7.58305 13.7272 7.68948C13.699 7.79591 13.6502 7.89574 13.5834 7.98329V8.00829Z" fill="#36AB80"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
|
|
@ -0,0 +1,85 @@
|
|||
import React, { ReactNode, useState } from "react";
|
||||
import styled from "styled-components";
|
||||
import { Icon, Popover, PopoverPosition } from "@blueprintjs/core";
|
||||
|
||||
const IconContainer = styled.div`
|
||||
margin: 0 10px;
|
||||
border: 1px solid #bcccd9;
|
||||
border-radius: 50%;
|
||||
min-width: 32px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-grow: 1;
|
||||
`;
|
||||
|
||||
const DeployLinkDialog = styled.a`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
padding: 10px;
|
||||
width: 336px;
|
||||
height: 60px;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
color: #2e3d49;
|
||||
:hover {
|
||||
text-decoration: none;
|
||||
color: #2e3d49;
|
||||
}
|
||||
`;
|
||||
|
||||
const DeployUrl = styled.div`
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
`;
|
||||
|
||||
type Props = {
|
||||
trigger: ReactNode;
|
||||
link: string;
|
||||
};
|
||||
|
||||
export const DeployLinkButton = (props: Props) => {
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
|
||||
const onClose = () => {
|
||||
setIsOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Popover
|
||||
modifiers={{
|
||||
offset: {
|
||||
enabled: true,
|
||||
offset: "0, 5",
|
||||
},
|
||||
}}
|
||||
content={
|
||||
<DeployLinkDialog target="_blank" href={props.link}>
|
||||
<IconContainer>
|
||||
<Icon icon="link" color="#BCCCD9" />
|
||||
</IconContainer>
|
||||
<DeployUrl>
|
||||
{window.location.origin}
|
||||
{props.link}
|
||||
</DeployUrl>
|
||||
<Icon icon="share" color={"rgba(0,0,0,0.5)"} />
|
||||
</DeployLinkDialog>
|
||||
}
|
||||
canEscapeKeyClose={false}
|
||||
onClose={onClose}
|
||||
isOpen={isOpen}
|
||||
position={PopoverPosition.BOTTOM}
|
||||
>
|
||||
<div onClick={() => setIsOpen(true)}>{props.trigger}</div>
|
||||
</Popover>
|
||||
</React.Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
export default DeployLinkButton;
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
/*Huge thanks to @tobiasahlin at http://tobiasahlin.com/spinkit/ */
|
||||
|
||||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
|
||||
const Spinner = styled.div`
|
||||
width: 30px;
|
||||
text-align: center;
|
||||
&& > div {
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
background-color: #fff;
|
||||
|
||||
border-radius: 100%;
|
||||
display: inline-block;
|
||||
-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
|
||||
animation: sk-bouncedelay 1.4s infinite ease-in-out both;
|
||||
}
|
||||
|
||||
&& .bounce1 {
|
||||
-webkit-animation-delay: -0.32s;
|
||||
animation-delay: -0.32s;
|
||||
}
|
||||
|
||||
&& .bounce2 {
|
||||
-webkit-animation-delay: -0.16s;
|
||||
animation-delay: -0.16s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes sk-bouncedelay {
|
||||
0%,
|
||||
80%,
|
||||
100% {
|
||||
-webkit-transform: scale(0);
|
||||
}
|
||||
40% {
|
||||
-webkit-transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes sk-bouncedelay {
|
||||
0%,
|
||||
80%,
|
||||
100% {
|
||||
-webkit-transform: scale(0);
|
||||
transform: scale(0);
|
||||
}
|
||||
40% {
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
type Props = {
|
||||
className?: string;
|
||||
};
|
||||
|
||||
const ThreeDotLoading = (props: Props) => {
|
||||
return (
|
||||
<Spinner className={props.className}>
|
||||
<div className="bounce1" />
|
||||
<div className="bounce2" />
|
||||
<div className="bounce3" />
|
||||
</Spinner>
|
||||
);
|
||||
};
|
||||
|
||||
export default ThreeDotLoading;
|
||||
|
|
@ -96,6 +96,7 @@ export type ButtonProps = {
|
|||
className?: string;
|
||||
fluid?: boolean;
|
||||
skin?: Skin;
|
||||
target?: string;
|
||||
};
|
||||
|
||||
export const Button = (props: ButtonProps) => {
|
||||
|
|
@ -133,6 +134,7 @@ export const Button = (props: ButtonProps) => {
|
|||
rightIcon={rightIcon}
|
||||
{...baseProps}
|
||||
href={props.href}
|
||||
target={props.target}
|
||||
/>
|
||||
);
|
||||
} else
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import React, { ReactNode, useState } from "react";
|
||||
import styled from "styled-components";
|
||||
import { connect } from "react-redux";
|
||||
import { Dialog, Classes } from "@blueprintjs/core";
|
||||
import { isPermitted } from "pages/Applications/permissionHelpers";
|
||||
|
||||
|
|
@ -75,4 +74,4 @@ export const FormDialogComponent = (props: FormDialogComponentProps) => {
|
|||
);
|
||||
};
|
||||
|
||||
export default connect()(FormDialogComponent);
|
||||
export default FormDialogComponent;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
import React, { JSXElementConstructor } from "react";
|
||||
import { IconProps, IconWrapper } from "constants/IconConstants";
|
||||
import { ReactComponent as ShareIcon } from "assets/icons/header/share-white.svg";
|
||||
import { ReactComponent as DeployIcon } from "assets/icons/header/deploy.svg";
|
||||
import { ReactComponent as FeedbackIcon } from "assets/icons/header/feedback.svg";
|
||||
import { ReactComponent as SaveFailureIcon } from "assets/icons/header/save-failure.svg";
|
||||
import { ReactComponent as SaveSuccessIcon } from "assets/icons/header/save-success.svg";
|
||||
/* eslint-disable react/display-name */
|
||||
|
||||
export const HeaderIcons: {
|
||||
|
|
@ -11,6 +15,26 @@ export const HeaderIcons: {
|
|||
<ShareIcon />
|
||||
</IconWrapper>
|
||||
),
|
||||
DEPLOY: (props: IconProps) => (
|
||||
<IconWrapper {...props}>
|
||||
<DeployIcon />
|
||||
</IconWrapper>
|
||||
),
|
||||
FEEDBACK: (props: IconProps) => (
|
||||
<IconWrapper {...props}>
|
||||
<FeedbackIcon />
|
||||
</IconWrapper>
|
||||
),
|
||||
SAVE_FAILURE: (props: IconProps) => (
|
||||
<IconWrapper {...props}>
|
||||
<SaveFailureIcon />
|
||||
</IconWrapper>
|
||||
),
|
||||
SAVE_SUCCESS: (props: IconProps) => (
|
||||
<IconWrapper {...props}>
|
||||
<SaveSuccessIcon />
|
||||
</IconWrapper>
|
||||
),
|
||||
};
|
||||
|
||||
export type HeaderIconName = keyof typeof HeaderIcons;
|
||||
|
|
|
|||
|
|
@ -150,7 +150,7 @@ export const AppViewerHeader = (props: AppViewerHeaderProps) => {
|
|||
intent="none"
|
||||
outline
|
||||
size="small"
|
||||
className="t--application-share-btn share-button"
|
||||
className="t--application-share-btn"
|
||||
icon={
|
||||
<HeaderIcons.SHARE
|
||||
color={Colors.WHITE}
|
||||
|
|
|
|||
|
|
@ -1,62 +1,124 @@
|
|||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
import { Breadcrumbs, IBreadcrumbProps } from "@blueprintjs/core";
|
||||
import { ApplicationPayload } from "constants/ReduxActionConstants";
|
||||
import {
|
||||
ApplicationPayload,
|
||||
ReduxActionTypes,
|
||||
} from "constants/ReduxActionConstants";
|
||||
import {
|
||||
APPLICATIONS_URL,
|
||||
BUILDER_PAGE_URL,
|
||||
PAGE_LIST_EDITOR_URL,
|
||||
getApplicationViewerPageURL,
|
||||
} from "constants/routes";
|
||||
import {
|
||||
PERMISSION_TYPE,
|
||||
isPermitted,
|
||||
} from "pages/Applications/permissionHelpers";
|
||||
import { Directions } from "utils/helpers";
|
||||
import InviteUsersFormv2 from "pages/organization/InviteUsersFromv2";
|
||||
import { PageListPayload } from "constants/ReduxActionConstants";
|
||||
import Button from "components/editorComponents/Button";
|
||||
import StyledHeader from "components/designSystems/appsmith/StyledHeader";
|
||||
import CustomizedDropdown, {
|
||||
CustomizedDropdownProps,
|
||||
} from "pages/common/CustomizedDropdown";
|
||||
import {
|
||||
DropdownOnSelectActions,
|
||||
getOnSelectAction,
|
||||
} from "pages/common/CustomizedDropdown/dropdownHelpers";
|
||||
import AnalyticsUtil from "utils/AnalyticsUtil";
|
||||
import { Skin } from "constants/DefaultTheme";
|
||||
import { HelpModal } from "components/designSystems/appsmith/help/HelpModal";
|
||||
import { FormDialogComponent } from "components/editorComponents/form/FormDialogComponent";
|
||||
import { Colors } from "constants/Colors";
|
||||
import AppsmithLogo from "assets/images/appsmith_logo_white.png";
|
||||
import { Link } from "react-router-dom";
|
||||
import { AppState } from "reducers";
|
||||
import {
|
||||
getCurrentApplicationId,
|
||||
getCurrentPageId,
|
||||
getIsPageSaving,
|
||||
getIsPublishingApplication,
|
||||
} from "selectors/editorSelectors";
|
||||
import { getCurrentOrgId } from "selectors/organizationSelectors";
|
||||
import { connect } from "react-redux";
|
||||
import { HeaderIcons } from "icons/HeaderIcons";
|
||||
import ThreeDotLoading from "components/designSystems/appsmith/header/ThreeDotsLoading";
|
||||
import DeployLinkButtonDialog from "components/designSystems/appsmith/header/DeployLinkButton";
|
||||
|
||||
const LoadingContainer = styled.div`
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
flex-shrink: 1;
|
||||
margin: 0 10px;
|
||||
const HeaderWrapper = styled(StyledHeader)`
|
||||
background: ${Colors.BALTIC_SEA};
|
||||
height: 48px;
|
||||
color: white;
|
||||
flex-direction: row;
|
||||
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
|
||||
`;
|
||||
|
||||
const PreviewPublishSection = styled.div`
|
||||
const HeaderSection = styled.div`
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
flex-shrink: 1;
|
||||
`;
|
||||
|
||||
const StretchedBreadCrumb = styled(Breadcrumbs)`
|
||||
&& {
|
||||
flex-shrink: 1;
|
||||
* {
|
||||
font-family: ${props => props.theme.fonts[0]};
|
||||
font-size: ${props => props.theme.fontSizes[2]}px;
|
||||
}
|
||||
:nth-child(1) {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
:nth-child(2) {
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
:nth-child(3) {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
`;
|
||||
|
||||
const ShareButton = styled.div`
|
||||
const AppsmithLogoImg = styled.img`
|
||||
max-width: 110px;
|
||||
`;
|
||||
|
||||
const ApplicationName = styled.span`
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 14px;
|
||||
color: #fff;
|
||||
margin-bottom: 6px;
|
||||
`;
|
||||
|
||||
const PageName = styled.span`
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
justify-content: flex-end;
|
||||
flex: 1;
|
||||
font-size: 12px;
|
||||
line-height: 12px;
|
||||
letter-spacing: 0.04em;
|
||||
color: #ffffff;
|
||||
opacity: 0.5;
|
||||
`;
|
||||
|
||||
const SaveStatusContainer = styled.div`
|
||||
margin: 0 10px;
|
||||
border: 1px solid rgb(95, 105, 116);
|
||||
border-radius: 50%;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
`;
|
||||
const DeploySection = styled.div`
|
||||
display: flex;
|
||||
`;
|
||||
|
||||
const DeployButton = styled(Button)`
|
||||
height: 32px;
|
||||
margin: 5px 10px;
|
||||
margin-right: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
`;
|
||||
|
||||
const DeployLinkButton = styled(Button)`
|
||||
height: 32px;
|
||||
margin: 5px 10px;
|
||||
margin-left: 0;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
min-width: 20px !important;
|
||||
width: 20px !important;
|
||||
background-color: rgb(42, 195, 157) !important;
|
||||
border: none !important;
|
||||
`;
|
||||
|
||||
const ShareButton = styled(Button)`
|
||||
height: 32px;
|
||||
margin: 5px 10px;
|
||||
color: white !important;
|
||||
border-color: rgb(95, 105, 116) !important;
|
||||
`;
|
||||
|
||||
type EditorHeaderProps = {
|
||||
|
|
@ -64,143 +126,173 @@ type EditorHeaderProps = {
|
|||
isSaving?: boolean;
|
||||
pageSaveError?: boolean;
|
||||
pageName?: string;
|
||||
onPublish: () => void;
|
||||
onCreatePage: (name: string) => void;
|
||||
pages?: PageListPayload;
|
||||
currentPageId?: string;
|
||||
pageId?: string;
|
||||
isPublishing: boolean;
|
||||
publishedTime?: string;
|
||||
orgId: string;
|
||||
currentApplicationId?: string;
|
||||
createModal: () => void;
|
||||
applicationId?: string;
|
||||
publishApplication: (appId: string) => void;
|
||||
};
|
||||
const navigation: IBreadcrumbProps[] = [
|
||||
{ href: APPLICATIONS_URL, icon: "home", text: "Home" },
|
||||
{ href: APPLICATIONS_URL, icon: "folder-close", text: "Applications" },
|
||||
{ icon: "page-layout", text: "", current: true },
|
||||
];
|
||||
|
||||
export const EditorHeader = (props: EditorHeaderProps) => {
|
||||
const {
|
||||
currentApplication,
|
||||
isSaving,
|
||||
pageSaveError,
|
||||
onPublish,
|
||||
pages,
|
||||
currentPageId,
|
||||
pageId,
|
||||
isPublishing,
|
||||
orgId,
|
||||
currentApplicationId,
|
||||
applicationId,
|
||||
pageName,
|
||||
publishApplication,
|
||||
} = props;
|
||||
|
||||
const selectedPageName = pages?.find(page => page.pageId === currentPageId)
|
||||
?.pageName;
|
||||
const handlePublish = () => {
|
||||
if (applicationId) {
|
||||
publishApplication(applicationId);
|
||||
|
||||
const pageSelectorData: CustomizedDropdownProps = {
|
||||
sections: [
|
||||
{
|
||||
isSticky: true,
|
||||
options: [
|
||||
{
|
||||
content: (
|
||||
<Button
|
||||
text="Manage Pages"
|
||||
icon="page-layout"
|
||||
iconAlignment={Directions.LEFT}
|
||||
skin={Skin.LIGHT}
|
||||
/>
|
||||
),
|
||||
onSelect: () =>
|
||||
getOnSelectAction(DropdownOnSelectActions.REDIRECT, {
|
||||
path: PAGE_LIST_EDITOR_URL(currentApplicationId, currentPageId),
|
||||
}),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
options: pages
|
||||
? pages.map(page => {
|
||||
const url = BUILDER_PAGE_URL(currentApplicationId, page.pageId);
|
||||
return {
|
||||
content: page.pageName,
|
||||
onSelect: () => {
|
||||
AnalyticsUtil.logEvent("PAGE_SWITCH", {
|
||||
pageName: page.pageName,
|
||||
pageId: page.pageId,
|
||||
mode: "EDIT",
|
||||
});
|
||||
getOnSelectAction(DropdownOnSelectActions.REDIRECT, {
|
||||
path: url,
|
||||
});
|
||||
},
|
||||
shouldCloseDropdown: true,
|
||||
active: page.pageId === currentPageId,
|
||||
};
|
||||
})
|
||||
: [],
|
||||
},
|
||||
],
|
||||
trigger: {
|
||||
text: selectedPageName,
|
||||
},
|
||||
openDirection: Directions.BOTTOM,
|
||||
openOnHover: false,
|
||||
const appName = currentApplication ? currentApplication.name : "";
|
||||
AnalyticsUtil.logEvent("PUBLISH_APP", {
|
||||
appId: applicationId,
|
||||
appName,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
let saveStatusMessage = "";
|
||||
let saveStatusIcon: React.ReactNode;
|
||||
if (isSaving) {
|
||||
saveStatusMessage = "Saving...";
|
||||
}
|
||||
if (!isSaving && !pageSaveError) {
|
||||
saveStatusMessage = "All changes saved";
|
||||
saveStatusIcon = <ThreeDotLoading className="t--save-status-is-saving" />;
|
||||
} else {
|
||||
if (!pageSaveError) {
|
||||
saveStatusIcon = (
|
||||
<HeaderIcons.SAVE_SUCCESS
|
||||
color={"#36AB80"}
|
||||
height={20}
|
||||
width={20}
|
||||
className="t--save-status-success"
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
saveStatusIcon = (
|
||||
<HeaderIcons.SAVE_FAILURE
|
||||
color={"#F69D2C"}
|
||||
height={20}
|
||||
width={20}
|
||||
className={"t--save-status-error"}
|
||||
/>
|
||||
);
|
||||
}
|
||||
}
|
||||
const applicationPermissions = currentApplication?.userPermissions
|
||||
? currentApplication.userPermissions
|
||||
: [];
|
||||
|
||||
return (
|
||||
<StyledHeader>
|
||||
<StretchedBreadCrumb items={navigation} minVisibleItems={3} />
|
||||
<CustomizedDropdown {...pageSelectorData} />
|
||||
<ShareButton>
|
||||
<HeaderWrapper>
|
||||
<HeaderSection>
|
||||
<Link to={APPLICATIONS_URL}>
|
||||
<AppsmithLogoImg
|
||||
src={AppsmithLogo}
|
||||
alt="Appsmith logo"
|
||||
className="t--appsmith-logo"
|
||||
/>
|
||||
</Link>
|
||||
</HeaderSection>
|
||||
<HeaderSection flex-direction={"row"}>
|
||||
<ApplicationName>{currentApplication?.name} </ApplicationName>
|
||||
<PageName>{pageName} </PageName>
|
||||
</HeaderSection>
|
||||
<HeaderSection>
|
||||
<SaveStatusContainer className={"t--save-status-container"}>
|
||||
{saveStatusIcon}
|
||||
</SaveStatusContainer>
|
||||
<ShareButton
|
||||
target="_blank"
|
||||
href="https://mail.google.com/mail/u/0/?view=cm&fs=1&to=feedback@appsmith.com&tf=1"
|
||||
text="Feedback"
|
||||
intent="none"
|
||||
outline
|
||||
size="small"
|
||||
className="t--application-feedback-btn"
|
||||
icon={
|
||||
<HeaderIcons.FEEDBACK color={Colors.WHITE} width={13} height={13} />
|
||||
}
|
||||
/>
|
||||
{isPermitted(
|
||||
applicationPermissions,
|
||||
PERMISSION_TYPE.MANAGE_APPLICATION,
|
||||
) && (
|
||||
<FormDialogComponent
|
||||
trigger={
|
||||
<Button
|
||||
<ShareButton
|
||||
text="Share"
|
||||
intent="primary"
|
||||
intent="none"
|
||||
outline
|
||||
size="small"
|
||||
className="t--application-share-btn"
|
||||
icon={
|
||||
<HeaderIcons.SHARE
|
||||
color={Colors.WHITE}
|
||||
width={13}
|
||||
height={13}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
}
|
||||
Form={InviteUsersFormv2}
|
||||
orgId={orgId}
|
||||
applicationId={currentApplicationId}
|
||||
applicationId={applicationId}
|
||||
title={
|
||||
currentApplication ? currentApplication.name : "Share Application"
|
||||
}
|
||||
/>
|
||||
)}
|
||||
</ShareButton>
|
||||
|
||||
<LoadingContainer>{saveStatusMessage}</LoadingContainer>
|
||||
<PreviewPublishSection>
|
||||
<Button
|
||||
onClick={onPublish}
|
||||
text="Publish"
|
||||
loading={isPublishing}
|
||||
intent="primary"
|
||||
filled
|
||||
size="small"
|
||||
className="t--application-publish-btn"
|
||||
/>
|
||||
</PreviewPublishSection>
|
||||
<DeploySection>
|
||||
<DeployButton
|
||||
onClick={handlePublish}
|
||||
text="Deploy"
|
||||
loading={isPublishing}
|
||||
intent="primary"
|
||||
filled
|
||||
size="small"
|
||||
className="t--application-publish-btn"
|
||||
icon={
|
||||
<HeaderIcons.DEPLOY color={Colors.WHITE} width={13} height={13} />
|
||||
}
|
||||
/>
|
||||
<DeployLinkButtonDialog
|
||||
trigger={
|
||||
<DeployLinkButton icon="caret-down" filled intent="primary" />
|
||||
}
|
||||
link={getApplicationViewerPageURL(applicationId, pageId)}
|
||||
/>
|
||||
</DeploySection>
|
||||
</HeaderSection>
|
||||
{}
|
||||
<HelpModal />
|
||||
</StyledHeader>
|
||||
</HeaderWrapper>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditorHeader;
|
||||
const mapStateToProps = (state: AppState) => ({
|
||||
pageName: state.ui.editor.currentPageName,
|
||||
isSaving: getIsPageSaving(state),
|
||||
orgId: getCurrentOrgId(state),
|
||||
applicationId: getCurrentApplicationId(state),
|
||||
currentApplication: state.ui.applications.currentApplication,
|
||||
isPublishing: getIsPublishingApplication(state),
|
||||
pageId: getCurrentPageId(state),
|
||||
});
|
||||
|
||||
const mapDispatchToProps = (dispatch: any) => ({
|
||||
publishApplication: (applicationId: string) => {
|
||||
dispatch({
|
||||
type: ReduxActionTypes.PUBLISH_APPLICATION_INIT,
|
||||
payload: {
|
||||
applicationId,
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(EditorHeader);
|
||||
|
|
|
|||
|
|
@ -6,59 +6,40 @@ import { withRouter, RouteComponentProps } from "react-router-dom";
|
|||
import {
|
||||
BuilderRouteParams,
|
||||
getApplicationViewerPageURL,
|
||||
BUILDER_PAGE_URL,
|
||||
} from "constants/routes";
|
||||
import { AppState } from "reducers";
|
||||
import EditorHeader from "./EditorHeader";
|
||||
import MainContainer from "./MainContainer";
|
||||
import { DndProvider } from "react-dnd";
|
||||
import TouchBackend from "react-dnd-touch-backend";
|
||||
import {
|
||||
getCurrentApplicationId,
|
||||
getCurrentPageId,
|
||||
getPageList,
|
||||
getIsPublishingApplication,
|
||||
getPublishingError,
|
||||
getIsPageSaving,
|
||||
getIsEditorLoading,
|
||||
getLoadingError,
|
||||
getIsEditorInitialized,
|
||||
getIsPublishingApplication,
|
||||
} from "selectors/editorSelectors";
|
||||
import {
|
||||
ReduxActionTypes,
|
||||
PageListPayload,
|
||||
ApplicationPayload,
|
||||
} from "constants/ReduxActionConstants";
|
||||
import { Dialog, Classes, AnchorButton } from "@blueprintjs/core";
|
||||
import { initEditor } from "actions/initActions";
|
||||
import { RenderModes } from "constants/WidgetConstants";
|
||||
import AnalyticsUtil from "utils/AnalyticsUtil";
|
||||
import { fetchPage } from "actions/pageActions";
|
||||
import { editorInitializer } from "utils/EditorUtils";
|
||||
import { getCurrentOrgId } from "selectors/organizationSelectors";
|
||||
|
||||
type EditorProps = {
|
||||
currentPageName?: string;
|
||||
isSaving: boolean;
|
||||
currentOrgId: string;
|
||||
currentApplicationId?: string;
|
||||
currentPageId?: string;
|
||||
publishApplication: Function;
|
||||
previewPage: Function;
|
||||
initEditor: Function;
|
||||
createPage: Function;
|
||||
fetchPage: (pageId: string) => void;
|
||||
pages: PageListPayload;
|
||||
isPublishing: boolean;
|
||||
isEditorLoading: boolean;
|
||||
isEditorInitialized: boolean;
|
||||
editorLoadingError: boolean;
|
||||
errorPublishing: boolean;
|
||||
createModal: () => void;
|
||||
currentApplication?: ApplicationPayload;
|
||||
} & RouteComponentProps<BuilderRouteParams>;
|
||||
};
|
||||
|
||||
class Editor extends Component<EditorProps> {
|
||||
type Props = EditorProps & RouteComponentProps<BuilderRouteParams>;
|
||||
|
||||
class Editor extends Component<Props> {
|
||||
public state = {
|
||||
isDialogOpen: false,
|
||||
registered: false,
|
||||
|
|
@ -73,7 +54,7 @@ class Editor extends Component<EditorProps> {
|
|||
this.props.initEditor(applicationId, pageId);
|
||||
}
|
||||
}
|
||||
componentDidUpdate(previously: EditorProps) {
|
||||
componentDidUpdate(previously: Props) {
|
||||
if (
|
||||
previously.isPublishing &&
|
||||
!(this.props.isPublishing || this.props.errorPublishing)
|
||||
|
|
@ -92,29 +73,6 @@ class Editor extends Component<EditorProps> {
|
|||
isDialogOpen: false,
|
||||
});
|
||||
};
|
||||
handlePublish = () => {
|
||||
if (this.props.currentApplicationId) {
|
||||
this.props.publishApplication(this.props.currentApplicationId);
|
||||
|
||||
const appName = this.props.currentApplication
|
||||
? this.props.currentApplication.name
|
||||
: "";
|
||||
AnalyticsUtil.logEvent("PUBLISH_APP", {
|
||||
appId: this.props.currentApplicationId,
|
||||
appName: appName,
|
||||
});
|
||||
}
|
||||
};
|
||||
handleCreatePage = (pageName: string) => {
|
||||
this.props.createPage(this.props.currentApplicationId, pageName);
|
||||
};
|
||||
redirectToPage = (pageId: string) => {
|
||||
if (this.props.currentApplicationId) {
|
||||
this.props.history.push(
|
||||
BUILDER_PAGE_URL(this.props.currentApplicationId, pageId),
|
||||
);
|
||||
}
|
||||
};
|
||||
public render() {
|
||||
if (!this.props.match.params.applicationId) {
|
||||
return <Redirect to="/applications" />;
|
||||
|
|
@ -131,19 +89,6 @@ class Editor extends Component<EditorProps> {
|
|||
<meta charSet="utf-8" />
|
||||
<title>Editor | Appsmith</title>
|
||||
</Helmet>
|
||||
<EditorHeader
|
||||
isSaving={this.props.isSaving}
|
||||
pageName={this.props.currentPageName}
|
||||
onPublish={this.handlePublish}
|
||||
onCreatePage={this.handleCreatePage}
|
||||
pages={this.props.pages}
|
||||
currentPageId={this.props.currentPageId}
|
||||
currentApplicationId={this.props.currentApplicationId}
|
||||
currentApplication={this.props.currentApplication}
|
||||
isPublishing={this.props.isPublishing}
|
||||
createModal={this.props.createModal}
|
||||
orgId={this.props.currentOrgId}
|
||||
/>
|
||||
<MainContainer />
|
||||
<Dialog
|
||||
isOpen={this.state.isDialogOpen}
|
||||
|
|
@ -180,15 +125,10 @@ class Editor extends Component<EditorProps> {
|
|||
}
|
||||
|
||||
const mapStateToProps = (state: AppState) => ({
|
||||
currentPageName: state.ui.editor.currentPageName,
|
||||
isSaving: getIsPageSaving(state),
|
||||
currentOrgId: getCurrentOrgId(state),
|
||||
currentApplicationId: getCurrentApplicationId(state),
|
||||
currentApplication: state.ui.applications.currentApplication,
|
||||
currentPageId: getCurrentPageId(state),
|
||||
pages: getPageList(state),
|
||||
errorPublishing: getPublishingError(state),
|
||||
isPublishing: getIsPublishingApplication(state),
|
||||
errorPublishing: getPublishingError(state),
|
||||
isEditorLoading: getIsEditorLoading(state),
|
||||
isEditorInitialized: getIsEditorInitialized(state),
|
||||
editorLoadingError: getLoadingError(state),
|
||||
|
|
@ -198,41 +138,7 @@ const mapDispatchToProps = (dispatch: any) => {
|
|||
return {
|
||||
initEditor: (applicationId: string, pageId: string) =>
|
||||
dispatch(initEditor(applicationId, pageId)),
|
||||
publishApplication: (applicationId: string) => {
|
||||
dispatch({
|
||||
type: ReduxActionTypes.PUBLISH_APPLICATION_INIT,
|
||||
payload: {
|
||||
applicationId,
|
||||
},
|
||||
});
|
||||
},
|
||||
previewPage: (pageId: string, layoutId: string) => {
|
||||
dispatch({
|
||||
type: ReduxActionTypes.FETCH_PUBLISHED_PAGE_INIT,
|
||||
payload: {
|
||||
pageId,
|
||||
layoutId,
|
||||
},
|
||||
});
|
||||
},
|
||||
fetchPage: (pageId: string) => dispatch(fetchPage(pageId)),
|
||||
createPage: (applicationId: string, name: string) => {
|
||||
dispatch({
|
||||
type: ReduxActionTypes.CREATE_PAGE_INIT,
|
||||
payload: {
|
||||
applicationId,
|
||||
name,
|
||||
},
|
||||
});
|
||||
},
|
||||
// TODO(abhinav): get the render mode from context
|
||||
createModal: () =>
|
||||
dispatch({
|
||||
type: ReduxActionTypes.CREATE_MODAL_INIT,
|
||||
payload: {
|
||||
renderMode: RenderModes.CANVAS,
|
||||
},
|
||||
}),
|
||||
};
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -12,17 +12,10 @@ import {
|
|||
} from "constants/routes";
|
||||
import { withRouter, RouteComponentProps } from "react-router";
|
||||
import AppViewerHeader from "pages/AppViewer/viewer/AppViewerHeader";
|
||||
import AppEditorHeader from "pages/Editor/EditorHeader";
|
||||
|
||||
type Props = { getCurrentUser: () => void } & RouteComponentProps;
|
||||
|
||||
const NoRender = () => {
|
||||
return null;
|
||||
};
|
||||
/*
|
||||
* App header is rendered as the first thing in the app. This kicks off the auth check
|
||||
* Currently each path has rendered their own header but we can move that here to have
|
||||
* a consistent header experience
|
||||
*/
|
||||
class AppHeader extends React.Component<Props, any> {
|
||||
componentDidMount() {
|
||||
this.props.getCurrentUser();
|
||||
|
|
@ -31,7 +24,7 @@ class AppHeader extends React.Component<Props, any> {
|
|||
return (
|
||||
<React.Fragment>
|
||||
<Switch>
|
||||
<Route path={BUILDER_URL} component={NoRender} />
|
||||
<Route path={BUILDER_URL} component={AppEditorHeader} />
|
||||
<Route path={APP_VIEW_URL} component={AppViewerHeader} />
|
||||
<Route path={USER_AUTH_URL} component={LoginHeader} />
|
||||
<Route path={BASE_URL} component={PageHeader} />
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ export const getCurrentApplicationId = (state: AppState) =>
|
|||
export const getCurrentPageName = createSelector(
|
||||
getPageListState,
|
||||
(pageList: PageListReduxState) =>
|
||||
pageList.pages.find(page => page.pageName === pageList.currentPageId)
|
||||
pageList.pages.find(page => page.pageId === pageList.currentPageId)
|
||||
?.pageName,
|
||||
);
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user