chore: Update upgrade button intercom message + Fix text color on error pages when background is dark (#18975)

This PR
- updates the upgrade button intercom message.
- Fixes text color on error pages when background is dark 

## Type of change
- Bug fix 


## How Has This Been Tested?
- Not needed.

## Checklist:
### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


### QA activity:
- [ ] Test plan has been approved by relevant developers
- [ ] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test
This commit is contained in:
Pawan Kumar 2022-12-30 16:27:10 +05:30 committed by GitHub
parent 5c3c5337bb
commit 5a1582eb7b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 4 deletions

View File

@ -1190,6 +1190,8 @@ export const ADMIN_BRANDING_COLOR_TOOLTIP_FONT = () =>
`Used as text color for the buttons.`;
export const ADMIN_BRANDING_COLOR_TOOLTIP_DISABLED = () =>
`Used as background color for disabled buttons.`;
export const ADMIN_BRANDING_UPGRADE_INTERCOM_MESSAGE = () =>
`I would like to enable Custom Branding for my workspace and am interested in Appsmith Business.`;
// Guided tour
// -- STEPS ---

View File

@ -4,6 +4,7 @@ import { Button } from "design-system";
import {
ADMIN_BRANDING_SETTINGS_SUBTITLE,
ADMIN_BRANDING_SETTINGS_TITLE,
ADMIN_BRANDING_UPGRADE_INTERCOM_MESSAGE,
createMessage,
} from "@appsmith/constants/messages";
import useOnUpgrade from "utils/hooks/useOnUpgrade";
@ -15,8 +16,7 @@ import {
const UpgradeBanner = () => {
const { onUpgrade } = useOnUpgrade({
logEventName: "BRANDING_UPGRADE_CLICK",
intercomMessage:
"Hello, I would like to upgrade my appsmith instance to use the custom branding feature",
intercomMessage: createMessage(ADMIN_BRANDING_UPGRADE_INTERCOM_MESSAGE),
});
return (

View File

@ -1,4 +1,7 @@
import React from "react";
import { useSelector } from "react-redux";
import { getTenantConfig } from "@appsmith/selectors/tenantSelectors";
import { getComplementaryGrayscaleColor } from "widgets/WidgetUtils";
type PageProps = {
children?: React.ReactNode;
@ -11,9 +14,16 @@ type PageProps = {
function Page(props: PageProps) {
const { cta, description, errorCode, title } = props;
const tenantConfig = useSelector(getTenantConfig);
const backgroundColor = tenantConfig.brandColors.background;
const textColor = getComplementaryGrayscaleColor(backgroundColor);
return (
<div className="absolute inset-0 flex flex-col items-center justify-center space-y-6 bg-[color:var(--ads-color-background-secondary)]">
<div
className={`absolute inset-0 flex flex-col items-center justify-center space-y-6 bg-[color:var(--ads-color-background-secondary)] ${
textColor === "white" ? "text-white" : ""
}`}
>
{errorCode && (
<div className="-mt-8 flex items-center font-bold text-3xl justify-center w-28 bg-white border aspect-square text-[color:var(--ads-color-brand)]">
{errorCode}

View File

@ -20,7 +20,7 @@ const PlayIcon = styled(ControlIcons.PLAY_VIDEO as AnyStyledComponent)`
}
`;
const PlayerWrapper = styled.div` import React, { Ref } from "react";
const PlayerWrapper = styled.div`
width: 600px;
height: 400px;
`;