refactor: admin settings (#9906)
* refactor admin settings feature * separated save-restart bar to separate component * created new CE dir to facilitate code split * created separate ee dir and exporting everything we have in ce file. * little mod * minor fix * splitting settings types config * using object literals for category types instead of enums * CE: support use of component for each category * minor style fix * authentication page UI changes implemented * github signup doc url added back * removed comments * routing updates * made subcategories listing in left pane optional * added muted saml to auth listing * added breadcrumbs and enabled button * created separate component for auth page and auth config * added callout and disconnect components * updated breadcrumbs component * minor updates to common components * updated warning callout and added icon * ce: test cases fixed * updated test file name * warning banner callout added on auth page * updated callout banner for form login * CE: Split config files * CE: moved the window declaration in EE file as its dependency will be updated in EE * CE: Splitting ApiConstants and SocialLogin constants * CE: split login page * CE: moved getSocialLoginButtonProps func to EE file as it's dependencies will be updated in EE * added key icon * CE: created a factory class to share social auths list * Minor style fix for social btns * Updated the third party auth styles * Small fixes to styling * ce: splitting forms constants * breadcrumbs implemented for all pages in admin settings * Settings breadcrumbs separated * splitted settings breadcrumbs between ce and ee * renamed default import * minor style fix * added login form config. * updated login/signup pages to use form login disabled config * removed common functionality outside * implemented breadcrumb component from scratch without using blueprint * removed unwanted code * Small style update * updated breadcrumb categories file name and breadcrumb icon * added cypress tests for admin settings auth page * added comments * update locator for upgrade button * added link for intercom on upgrade button * removed unnecessary file * minor style fix * style fix for auth option cards * split messages constant * fixed imports for message constants splitting. * added message constants * updated unit test cases * fixed messages import in cypress index * fixed messages import again, cypress fails to read re-exported objs. * added OIDC auth method on authentication page * updated import statements from ee to @appsmith * removed dead code * updated read more link UI * PR comments fixes * some UI fixes * used color and fonts from theme * fixed some imports * fixed some imports * removed warning imports * updated OIDC logo and auth method desc copies * css changes * css changes * css changes * updated cypress test for breadcrumb * moved callout component to ads as calloutv2 * UI changes for form fields * updated css for spacing between form fields * added sub-text on auth pages * added active class for breadcrumb item * added config for disable signup toggle and fixed UI issues of restart banner * fixed admin settings page bugs * assigned true as default state for signup * fixed messages import statements * updated code for PR comments related suggestions * reverted file path change in cypress support * updated cypress test * updated cypress test Co-authored-by: Ankita Kinger <ankita@appsmith.com>
This commit is contained in:
parent
d218b48cf6
commit
b778b83ac4
|
|
@ -1,4 +1,5 @@
|
|||
{
|
||||
"MySQL":1,
|
||||
"Mongo":1
|
||||
"Mongo":1,
|
||||
"Edition": 0
|
||||
}
|
||||
|
|
@ -1,4 +1,8 @@
|
|||
const AdminsSettingsLocators = require("../../../../locators/AdminsSettingsLocators.json");
|
||||
const {
|
||||
GITHUB_SIGNUP_SETUP_DOC,
|
||||
GOOGLE_SIGNUP_SETUP_DOC,
|
||||
} = require("../../../../../src/constants/ThirdPartyConstants");
|
||||
|
||||
describe("Admin settings page", function() {
|
||||
beforeEach(() => {
|
||||
|
|
@ -63,10 +67,50 @@ describe("Admin settings page", function() {
|
|||
cy.url().should("contain", "/settings/version");
|
||||
});
|
||||
|
||||
it("should test that setting page back button redirects to home page", () => {
|
||||
cy.get(AdminsSettingsLocators.backButton).should("be.visible");
|
||||
cy.get(AdminsSettingsLocators.backButton).click();
|
||||
cy.url().should("contain", "/applications");
|
||||
it("should test that authentication page redirects", () => {
|
||||
cy.visit("/settings/general");
|
||||
cy.get(AdminsSettingsLocators.authenticationTab).click();
|
||||
cy.url().should("contain", "/settings/authentication");
|
||||
cy.get(AdminsSettingsLocators.googleButton).click();
|
||||
cy.url().should("contain", "/settings/authentication/google-auth");
|
||||
cy.get(AdminsSettingsLocators.authenticationTab).click();
|
||||
cy.url().should("contain", "/settings/authentication");
|
||||
cy.get(AdminsSettingsLocators.githubButton).click();
|
||||
cy.url().should("contain", "/settings/authentication/github-auth");
|
||||
cy.get(AdminsSettingsLocators.authenticationTab).click();
|
||||
cy.url().should("contain", "/settings/authentication");
|
||||
cy.get(AdminsSettingsLocators.formloginButton).click();
|
||||
cy.url().should("contain", "/settings/authentication/form-login");
|
||||
});
|
||||
|
||||
it("should test that configure link redirects to google signup setup doc", () => {
|
||||
cy.visit("/settings/general");
|
||||
cy.get(AdminsSettingsLocators.authenticationTab).click();
|
||||
cy.url().should("contain", "/settings/authentication");
|
||||
cy.get(AdminsSettingsLocators.googleButton).click();
|
||||
cy.url().should("contain", "/settings/authentication/google-auth");
|
||||
cy.get(AdminsSettingsLocators.readMoreLink).within(() => {
|
||||
cy.get("a")
|
||||
.should("have.attr", "target", "_blank")
|
||||
.invoke("removeAttr", "target")
|
||||
.click();
|
||||
cy.url().should("contain", GOOGLE_SIGNUP_SETUP_DOC);
|
||||
});
|
||||
});
|
||||
|
||||
it("should test that configure link redirects to github signup setup doc", () => {
|
||||
cy.visit("/settings/general");
|
||||
cy.get(AdminsSettingsLocators.authenticationTab).click();
|
||||
cy.url().should("contain", "/settings/authentication");
|
||||
cy.get(AdminsSettingsLocators.githubButton).click();
|
||||
cy.url().should("contain", "/settings/authentication/github-auth");
|
||||
cy.get(AdminsSettingsLocators.readMoreLink).within(() => {
|
||||
cy.get("a")
|
||||
.should("have.attr", "target", "_blank")
|
||||
.invoke("removeAttr", "target")
|
||||
.click();
|
||||
cy.url().should("contain", GITHUB_SIGNUP_SETUP_DOC);
|
||||
});
|
||||
});
|
||||
|
||||
it("should test save and clear buttons disabled state", () => {
|
||||
|
|
@ -159,4 +203,71 @@ describe("Admin settings page", function() {
|
|||
cy.get(AdminsSettingsLocators.restartNotice).should("not.exist");
|
||||
cy.wait(3000);
|
||||
});
|
||||
|
||||
it("should test that breadcrumbs work properly", () => {
|
||||
// checking settings default page
|
||||
cy.visit("/settings/general");
|
||||
cy.get(AdminsSettingsLocators.breadcrumbList)
|
||||
.children()
|
||||
.within(() => {
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem).should(
|
||||
"have.length",
|
||||
"2",
|
||||
);
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem)
|
||||
.eq(0)
|
||||
.contains("Homepage")
|
||||
.should("have.attr", "href")
|
||||
.and("eq", "/applications");
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem)
|
||||
.eq(1)
|
||||
.contains("General")
|
||||
.should("not.have.attr", "href");
|
||||
});
|
||||
|
||||
// checking settings category page
|
||||
cy.visit("/settings/authentication");
|
||||
cy.get(AdminsSettingsLocators.breadcrumbList)
|
||||
.children()
|
||||
.within(() => {
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem).should(
|
||||
"have.length",
|
||||
"2",
|
||||
);
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem)
|
||||
.eq(0)
|
||||
.contains("Homepage")
|
||||
.should("have.attr", "href")
|
||||
.and("eq", "/applications");
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem)
|
||||
.eq(1)
|
||||
.contains("Authentication")
|
||||
.should("not.have.attr", "href");
|
||||
});
|
||||
|
||||
// checking settings subcategory page
|
||||
cy.visit("/settings/authentication/google-auth");
|
||||
cy.get(AdminsSettingsLocators.breadcrumbList)
|
||||
.children()
|
||||
.within(() => {
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem).should(
|
||||
"have.length",
|
||||
"3",
|
||||
);
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem)
|
||||
.eq(0)
|
||||
.contains("Homepage")
|
||||
.should("have.attr", "href")
|
||||
.and("eq", "/applications");
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem)
|
||||
.eq(1)
|
||||
.contains("Authentication")
|
||||
.should("have.attr", "href")
|
||||
.and("eq", "/settings/authentication");
|
||||
cy.get(AdminsSettingsLocators.breadcrumbItem)
|
||||
.eq(2)
|
||||
.contains("Google Authentication")
|
||||
.should("not.have.attr", "href");
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,31 @@
|
|||
const AdminsSettingsLocators = require("../../../../locators/AdminsSettingsLocators.json");
|
||||
const EnterpriseAdminSettingsLocators = require("../../../../locators/EnterpriseAdminSettingsLocators.json");
|
||||
|
||||
describe("Admin settings page", function() {
|
||||
beforeEach(() => {
|
||||
cy.intercept("GET", "/api/v1/admin/env", {
|
||||
body: { responseMeta: { status: 200, success: true }, data: {} },
|
||||
}).as("getEnvVariables");
|
||||
cy.intercept("PUT", "/api/v1/admin/env", {
|
||||
body: { responseMeta: { status: 200, success: true }, data: {} },
|
||||
}).as("postEnvVariables");
|
||||
});
|
||||
|
||||
it("should test that settings page is redirected to default tab", () => {
|
||||
cy.LoginFromAPI(Cypress.env("USERNAME"), Cypress.env("PASSWORD"));
|
||||
cy.visit("/applications");
|
||||
cy.wait(3000);
|
||||
cy.visit("/settings");
|
||||
cy.url().should("contain", "/settings/general");
|
||||
});
|
||||
|
||||
it("should test that authentication page shows upgrade button for SSO", () => {
|
||||
cy.visit("/settings/general");
|
||||
cy.get(AdminsSettingsLocators.authenticationTab).click();
|
||||
cy.url().should("contain", "/settings/authentication");
|
||||
cy.get(EnterpriseAdminSettingsLocators.upgradeButton).each(($el) => {
|
||||
cy.wrap($el).should("be.visible");
|
||||
cy.wrap($el).should("contain", "UPGRADE");
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -5,6 +5,10 @@
|
|||
"authenticationTab": ".t--settings-category-authentication",
|
||||
"emailTab": ".t--settings-category-email",
|
||||
"googleMapsTab": ".t--settings-category-google-maps",
|
||||
"googleButton": ".t--settings-sub-category-google-auth",
|
||||
"githubButton": ".t--settings-sub-category-github-auth",
|
||||
"formloginButton": ".t--settings-sub-category-form-login",
|
||||
"readMoreLink": ".t--read-more-link",
|
||||
"versionTab": ".t--settings-category-version",
|
||||
"backButton": ".t--admin-settings-back-button",
|
||||
"saveButton": ".t--admin-settings-save-button",
|
||||
|
|
@ -12,5 +16,7 @@
|
|||
"textInput": ".t--admin-settings-text-input input",
|
||||
"instanceName": ".t--admin-settings-APPSMITH_INSTANCE_NAME input",
|
||||
"fromAddress": ".t--admin-settings-APPSMITH_MAIL_FROM input",
|
||||
"restartNotice": ".t--admin-settings-restart-notice"
|
||||
"restartNotice": ".t--admin-settings-restart-notice",
|
||||
"breadcrumbList": ".t--breadcrumb-list",
|
||||
"breadcrumbItem": ".t--breadcrumb-item"
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"upgradeButton": ".t--settings-sub-category-upgrade"
|
||||
}
|
||||
|
|
@ -23,7 +23,7 @@ let appId;
|
|||
// Import commands.js using ES2015 syntax:
|
||||
import "./commands";
|
||||
import { initLocalstorage } from "./commands";
|
||||
import * as MESSAGES from "../../../client/src/constants/messages";
|
||||
import * as MESSAGES from "../../../client/src/ce/constants/messages.ts";
|
||||
|
||||
Cypress.on("uncaught:exception", (err, runnable) => {
|
||||
// returning false here prevents Cypress from
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import {
|
|||
createMessage,
|
||||
ERROR_0,
|
||||
SERVER_API_TIMEOUT_ERROR,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { ERROR_CODES } from "@appsmith/constants/ApiConstants";
|
||||
|
||||
describe("axios api interceptors", () => {
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import {
|
|||
ERROR_0,
|
||||
ERROR_500,
|
||||
SERVER_API_TIMEOUT_ERROR,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import axios, { AxiosRequestConfig, AxiosResponse } from "axios";
|
||||
import {
|
||||
API_STATUS_CODES,
|
||||
|
|
|
|||
3
app/client/src/assets/images/lock-password-line.svg
Normal file
3
app/client/src/assets/images/lock-password-line.svg
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M18 8H20C20.2652 8 20.5196 8.10536 20.7071 8.29289C20.8946 8.48043 21 8.73478 21 9V21C21 21.2652 20.8946 21.5196 20.7071 21.7071C20.5196 21.8946 20.2652 22 20 22H4C3.73478 22 3.48043 21.8946 3.29289 21.7071C3.10536 21.5196 3 21.2652 3 21V9C3 8.73478 3.10536 8.48043 3.29289 8.29289C3.48043 8.10536 3.73478 8 4 8H6V7C6 5.4087 6.63214 3.88258 7.75736 2.75736C8.88258 1.63214 10.4087 1 12 1C13.5913 1 15.1174 1.63214 16.2426 2.75736C17.3679 3.88258 18 5.4087 18 7V8ZM5 10V20H19V10H5ZM11 14H13V16H11V14ZM7 14H9V16H7V14ZM15 14H17V16H15V14ZM16 8V7C16 5.93913 15.5786 4.92172 14.8284 4.17157C14.0783 3.42143 13.0609 3 12 3C10.9391 3 9.92172 3.42143 9.17157 4.17157C8.42143 4.92172 8 5.93913 8 7V8H16Z" fill="#858282"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 824 B |
9
app/client/src/assets/images/oidc.svg
Normal file
9
app/client/src/assets/images/oidc.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 20 KiB |
5
app/client/src/assets/images/saml.svg
Normal file
5
app/client/src/assets/images/saml.svg
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M23.8354 16.7369C23.8227 16.7367 23.8103 16.7333 23.7993 16.727C23.7883 16.7207 23.779 16.7117 23.7724 16.7009C23.7004 16.5839 16.5214 4.84487 12.3124 5.90087C12.2704 5.90087 8.73343 6.50087 6.95143 14.2499C6.94966 14.2594 6.94597 14.2685 6.94058 14.2766C6.9352 14.2847 6.92823 14.2916 6.9201 14.2969C6.91197 14.3023 6.90285 14.3059 6.89328 14.3076C6.88371 14.3093 6.8739 14.3091 6.86443 14.3069C6.84558 14.3032 6.82884 14.2925 6.81768 14.2768C6.80652 14.2612 6.80178 14.2419 6.80443 14.2229C6.81943 14.1329 8.23243 5.20487 11.4094 0.782874C11.4204 0.766847 11.4372 0.755702 11.4562 0.751785C11.4752 0.747868 11.495 0.751485 11.5114 0.761874C11.5804 0.809874 18.4444 5.48688 23.9044 16.6619C23.9127 16.679 23.9139 16.6987 23.9077 16.7167C23.9015 16.7347 23.8885 16.7495 23.8714 16.7579C23.8578 16.7541 23.8454 16.7469 23.8354 16.7369Z" fill="#ED0000"/>
|
||||
<path d="M7.77641 1.50016C7.78299 1.51156 7.78646 1.52449 7.78646 1.53766C7.78646 1.55082 7.78299 1.56376 7.77641 1.57516C7.71041 1.69516 1.13141 13.7822 4.13741 16.9052C4.16441 16.9412 6.45641 19.7012 14.0374 17.3762C14.0465 17.3729 14.0561 17.3714 14.0657 17.3719C14.0753 17.3724 14.0848 17.3748 14.0934 17.379C14.1021 17.3832 14.1098 17.3891 14.1162 17.3963C14.1225 17.4036 14.1274 17.412 14.1304 17.4212C14.1373 17.4395 14.1368 17.4598 14.129 17.4777C14.1211 17.4957 14.1066 17.5098 14.0884 17.5172C14.0014 17.5502 5.56241 20.7902 0.144408 20.2502C0.125033 20.2479 0.107304 20.2382 0.0949826 20.223C0.0826606 20.2079 0.0767154 20.1886 0.0784081 20.1692C0.0964081 20.0792 0.714408 11.7962 7.65041 1.50016C7.66138 1.48413 7.67814 1.47299 7.69717 1.46907C7.71619 1.46515 7.736 1.46877 7.75241 1.47916C7.76216 1.48387 7.77045 1.49112 7.77641 1.50016Z" fill="#ED0000"/>
|
||||
<path d="M2.59214 23.022C2.59852 23.0109 2.60771 23.0018 2.61878 22.9954C2.62985 22.9891 2.6424 22.9858 2.65514 22.986C2.79314 22.986 16.5481 22.635 17.7511 18.468C17.7511 18.429 19.0111 15.0629 13.2001 9.65095C13.193 9.64421 13.1873 9.63608 13.1833 9.62705C13.1794 9.61802 13.1774 9.60829 13.1774 9.59845C13.1774 9.58861 13.1794 9.57887 13.1833 9.56984C13.1873 9.56081 13.193 9.55268 13.2001 9.54595C13.2145 9.53288 13.2332 9.52563 13.2526 9.52563C13.2721 9.52563 13.2908 9.53288 13.3051 9.54595C13.3681 9.59995 20.4001 15.2819 22.6351 20.247C22.6434 20.2641 22.6446 20.2838 22.6384 20.3018C22.6323 20.3197 22.6192 20.3346 22.6021 20.343C22.5271 20.379 15.0451 23.988 2.64914 23.133C2.63969 23.1326 2.6304 23.1303 2.62181 23.1263C2.61322 23.1224 2.6055 23.1167 2.59909 23.1098C2.59268 23.1028 2.58771 23.0946 2.58446 23.0857C2.58121 23.0769 2.57974 23.0674 2.58014 23.058C2.58134 23.0452 2.58545 23.0329 2.59214 23.022Z" fill="#ED0000"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.7 KiB |
1
app/client/src/ce/constants/forms.ts
Normal file
1
app/client/src/ce/constants/forms.ts
Normal file
|
|
@ -0,0 +1 @@
|
|||
export * from "constants/forms";
|
||||
|
|
@ -269,6 +269,9 @@ export const EDIT_DATASOURCE_MESSAGE = () =>
|
|||
"Edit Datasource to access authentication settings";
|
||||
export const OAUTH_ERROR = () => "OAuth Error";
|
||||
export const OAUTH_2_0 = () => "OAuth 2.0";
|
||||
export const ADD = () => "ADD";
|
||||
export const UPGRADE = () => "UPGRADE";
|
||||
export const EDIT = () => "EDIT";
|
||||
|
||||
export const ERROR_EVAL_ERROR_GENERIC = () =>
|
||||
`Unexpected error occurred while evaluating the application`;
|
||||
|
|
@ -937,6 +940,13 @@ export const GENERATE_APPLICATION_DESCRIPTION = () =>
|
|||
|
||||
export const DELETE_ORG_SUCCESSFUL = () => "Organization deleted successfully";
|
||||
|
||||
export const UPGRADE_TO_EE = (authLabel: string) =>
|
||||
`Hello, I would like to upgrade and start using ${authLabel} authentication.`;
|
||||
export const ADMIN_AUTH_SETTINGS_TITLE = () => "Select Authentication Method";
|
||||
export const ADMIN_AUTH_SETTINGS_SUBTITLE = () =>
|
||||
"Select a protocol you want to authenticate users with";
|
||||
export const DANGER_ZONE = () => "Danger Zone";
|
||||
|
||||
// Guided tour
|
||||
// -- STEPS ---
|
||||
export const STEP_ONE_TITLE = () =>
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
import {
|
||||
APPLICATIONS_URL,
|
||||
getAdminSettingsCategoryUrl,
|
||||
} from "constants/routes";
|
||||
import { SettingCategories } from "@appsmith/pages/AdminSettings/config/types";
|
||||
|
||||
export const BreadcrumbCategories = {
|
||||
HOMEPAGE: {
|
||||
href: APPLICATIONS_URL,
|
||||
text: "Homepage",
|
||||
},
|
||||
[SettingCategories.GENERAL]: {
|
||||
href: getAdminSettingsCategoryUrl(SettingCategories.GENERAL),
|
||||
text: "General",
|
||||
},
|
||||
[SettingCategories.EMAIL]: {
|
||||
href: getAdminSettingsCategoryUrl(SettingCategories.EMAIL),
|
||||
text: "Email",
|
||||
},
|
||||
[SettingCategories.GOOGLE_MAPS]: {
|
||||
href: getAdminSettingsCategoryUrl(SettingCategories.GOOGLE_MAPS),
|
||||
text: "Google Maps",
|
||||
},
|
||||
[SettingCategories.VERSION]: {
|
||||
href: getAdminSettingsCategoryUrl(SettingCategories.VERSION),
|
||||
text: "Version",
|
||||
},
|
||||
[SettingCategories.ADVANCED]: {
|
||||
href: getAdminSettingsCategoryUrl(SettingCategories.ADVANCED),
|
||||
text: "Advanced",
|
||||
},
|
||||
[SettingCategories.AUTHENTICATION]: {
|
||||
href: getAdminSettingsCategoryUrl(SettingCategories.AUTHENTICATION),
|
||||
text: "Authentication",
|
||||
},
|
||||
[SettingCategories.FORM_AUTH]: {
|
||||
href: getAdminSettingsCategoryUrl(
|
||||
SettingCategories.AUTHENTICATION,
|
||||
SettingCategories.FORM_AUTH,
|
||||
),
|
||||
text: "Form Login",
|
||||
},
|
||||
[SettingCategories.GOOGLE_AUTH]: {
|
||||
href: getAdminSettingsCategoryUrl(
|
||||
SettingCategories.AUTHENTICATION,
|
||||
SettingCategories.GOOGLE_AUTH,
|
||||
),
|
||||
text: "Google Authentication",
|
||||
},
|
||||
[SettingCategories.GITHUB_AUTH]: {
|
||||
href: getAdminSettingsCategoryUrl(
|
||||
SettingCategories.AUTHENTICATION,
|
||||
SettingCategories.GITHUB_AUTH,
|
||||
),
|
||||
text: "Github Authentication",
|
||||
},
|
||||
};
|
||||
|
|
@ -0,0 +1,228 @@
|
|||
import React, { useEffect } from "react";
|
||||
import { useHistory } from "react-router-dom";
|
||||
import { SettingCategories } from "../types";
|
||||
import styled from "styled-components";
|
||||
import Button, { Category } from "components/ads/Button";
|
||||
import {
|
||||
ADD,
|
||||
ADMIN_AUTH_SETTINGS_SUBTITLE,
|
||||
ADMIN_AUTH_SETTINGS_TITLE,
|
||||
createMessage,
|
||||
EDIT,
|
||||
UPGRADE,
|
||||
UPGRADE_TO_EE,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { getAdminSettingsCategoryUrl } from "constants/routes";
|
||||
import Icon, { IconSize } from "components/ads/Icon";
|
||||
import { Callout, CalloutType } from "components/ads/CalloutV2";
|
||||
import SettingsBreadcrumbs from "pages/Settings/SettingsBreadcrumbs";
|
||||
import { getAppsmithConfigs } from "@appsmith/configs";
|
||||
import { getCurrentUser } from "selectors/usersSelectors";
|
||||
import { useSelector } from "react-redux";
|
||||
import { bootIntercom } from "utils/helpers";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
||||
const { intercomAppID } = getAppsmithConfigs();
|
||||
|
||||
const Wrapper = styled.div`
|
||||
flex-basis: calc(100% - ${(props) => props.theme.homePage.leftPane.width}px);
|
||||
margin-left: 112px;
|
||||
padding-top: 40px;
|
||||
height: calc(100vh - ${(props) => props.theme.homePage.header}px);
|
||||
overflow: auto;
|
||||
`;
|
||||
|
||||
const SettingsFormWrapper = styled.div``;
|
||||
|
||||
const SettingsHeader = styled.h2`
|
||||
font-size: 24px;
|
||||
font-weight: 500;
|
||||
text-transform: capitalize;
|
||||
margin-bottom: 0;
|
||||
`;
|
||||
|
||||
const SettingsSubHeader = styled.div`
|
||||
font-size: 14px;
|
||||
margin-bottom: 0;
|
||||
`;
|
||||
|
||||
const MethodCard = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 32px 0;
|
||||
`;
|
||||
|
||||
const Image = styled.img`
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin-right: 8px;
|
||||
background: #f0f0f0;
|
||||
object-fit: cover;
|
||||
border-radius: 50%;
|
||||
padding: 5px;
|
||||
align-self: baseline;
|
||||
`;
|
||||
|
||||
const MethodDetailsWrapper = styled.div`
|
||||
color: #2e3d49;
|
||||
width: 492px;
|
||||
margin-right: 60px;
|
||||
`;
|
||||
|
||||
const MethodTitle = styled.div`
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 0 4px;
|
||||
`;
|
||||
|
||||
const MethodDets = styled.div`
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
`;
|
||||
|
||||
export type calloutType = "LINK" | "OTHER";
|
||||
|
||||
export type banner = {
|
||||
actionLabel: string;
|
||||
title: string;
|
||||
type: CalloutType;
|
||||
};
|
||||
|
||||
export type AuthMethodType = {
|
||||
id: string;
|
||||
category?: string;
|
||||
label: string;
|
||||
subText?: string;
|
||||
image?: any;
|
||||
needsUpgrade?: boolean;
|
||||
type: calloutType;
|
||||
isConnected?: boolean;
|
||||
calloutBanner?: banner;
|
||||
};
|
||||
|
||||
const EditButton = styled.div`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
`;
|
||||
|
||||
const AddButton = styled(Button)`
|
||||
height: 30px;
|
||||
padding: 8px 16px;
|
||||
`;
|
||||
|
||||
const ButtonTitle = styled.span`
|
||||
margin-right: 2px;
|
||||
font-size: 11px;
|
||||
`;
|
||||
|
||||
const Label = styled.span<{ enterprise?: boolean }>`
|
||||
display: inline;
|
||||
${(props) =>
|
||||
props.enterprise
|
||||
? `
|
||||
border: 1px solid ${Colors.COD_GRAY};
|
||||
color: ${Colors.COD_GRAY};
|
||||
background: #fff;
|
||||
`
|
||||
: `
|
||||
color: #03B365;
|
||||
background: #E5F6EC;
|
||||
`};
|
||||
padding: 0px 4px;
|
||||
font-size: 12px;
|
||||
`;
|
||||
|
||||
export function AuthPage({ authMethods }: { authMethods: AuthMethodType[] }) {
|
||||
const history = useHistory();
|
||||
const user = useSelector(getCurrentUser);
|
||||
|
||||
useEffect(() => {
|
||||
bootIntercom(user);
|
||||
}, [user?.email]);
|
||||
|
||||
const triggerIntercom = (authLabel: string) => {
|
||||
if (intercomAppID && window.Intercom) {
|
||||
window.Intercom(
|
||||
"showNewMessage",
|
||||
createMessage(UPGRADE_TO_EE, authLabel),
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Wrapper>
|
||||
<SettingsBreadcrumbs category={SettingCategories.AUTHENTICATION} />
|
||||
<SettingsFormWrapper>
|
||||
<SettingsHeader>
|
||||
{createMessage(ADMIN_AUTH_SETTINGS_TITLE)}
|
||||
</SettingsHeader>
|
||||
<SettingsSubHeader>
|
||||
{createMessage(ADMIN_AUTH_SETTINGS_SUBTITLE)}
|
||||
</SettingsSubHeader>
|
||||
{authMethods &&
|
||||
authMethods.map((method) => {
|
||||
return (
|
||||
<MethodCard key={method.id}>
|
||||
<Image alt={method.label} src={method.image} />
|
||||
<MethodDetailsWrapper>
|
||||
<MethodTitle>
|
||||
{method.label}
|
||||
{method.isConnected && <Label>Enabled</Label>}
|
||||
{method.needsUpgrade && (
|
||||
<Label enterprise>Enterprise</Label>
|
||||
)}
|
||||
</MethodTitle>
|
||||
<MethodDets>{method.subText}</MethodDets>
|
||||
{method.calloutBanner && (
|
||||
<Callout
|
||||
actionLabel={method.calloutBanner.actionLabel}
|
||||
title={method.calloutBanner.title}
|
||||
type={method.calloutBanner.type}
|
||||
/>
|
||||
)}
|
||||
</MethodDetailsWrapper>
|
||||
{method.isConnected ? (
|
||||
<EditButton
|
||||
className={`t--settings-sub-category-${method.category}`}
|
||||
onClick={() =>
|
||||
history.push(
|
||||
getAdminSettingsCategoryUrl(
|
||||
SettingCategories.AUTHENTICATION,
|
||||
method.category,
|
||||
),
|
||||
)
|
||||
}
|
||||
>
|
||||
<ButtonTitle>{createMessage(EDIT)}</ButtonTitle>
|
||||
<Icon name="right-arrow" size={IconSize.XL} />
|
||||
</EditButton>
|
||||
) : (
|
||||
<AddButton
|
||||
category={Category.tertiary}
|
||||
className={`add-button t--settings-sub-category-${
|
||||
method.needsUpgrade ? "upgrade" : method.category
|
||||
}`}
|
||||
data-cy="add-auth-account"
|
||||
onClick={() =>
|
||||
!method.needsUpgrade
|
||||
? history.push(
|
||||
getAdminSettingsCategoryUrl(
|
||||
SettingCategories.AUTHENTICATION,
|
||||
method.category,
|
||||
),
|
||||
)
|
||||
: triggerIntercom(method.label)
|
||||
}
|
||||
text={createMessage(!!method.needsUpgrade ? UPGRADE : ADD)}
|
||||
/>
|
||||
)}
|
||||
</MethodCard>
|
||||
);
|
||||
})}
|
||||
</SettingsFormWrapper>
|
||||
</Wrapper>
|
||||
);
|
||||
}
|
||||
|
|
@ -0,0 +1,209 @@
|
|||
import React from "react";
|
||||
import {
|
||||
GOOGLE_SIGNUP_SETUP_DOC,
|
||||
GITHUB_SIGNUP_SETUP_DOC,
|
||||
} from "constants/ThirdPartyConstants";
|
||||
import {
|
||||
SettingCategories,
|
||||
SettingTypes,
|
||||
SettingSubtype,
|
||||
AdminConfigType,
|
||||
} from "@appsmith/pages/AdminSettings/config/types";
|
||||
|
||||
import { AuthPage, AuthMethodType } from "./AuthPage";
|
||||
import Google from "assets/images/Google.png";
|
||||
import SamlSso from "assets/images/saml.svg";
|
||||
import OIDC from "assets/images/oidc.svg";
|
||||
import Github from "assets/images/Github.png";
|
||||
import Lock from "assets/images/lock-password-line.svg";
|
||||
import { getAppsmithConfigs } from "@appsmith/configs";
|
||||
const {
|
||||
disableLoginForm,
|
||||
enableGithubOAuth,
|
||||
enableGoogleOAuth,
|
||||
} = getAppsmithConfigs();
|
||||
const Form_Auth: AdminConfigType = {
|
||||
type: SettingCategories.FORM_AUTH,
|
||||
controlType: SettingTypes.GROUP,
|
||||
title: "Form Login",
|
||||
subText: "Enable your organization to sign in with Appsmith Form.",
|
||||
canSave: true,
|
||||
settings: [
|
||||
{
|
||||
id: "APPSMITH_FORM_LOGIN_DISABLED",
|
||||
category: SettingCategories.FORM_AUTH,
|
||||
subCategory: "form login",
|
||||
controlType: SettingTypes.TOGGLE,
|
||||
label: "Form Login Option",
|
||||
toggleText: (value: boolean) => {
|
||||
if (value) {
|
||||
return "Enable form login/signup";
|
||||
} else {
|
||||
return " Disable form login/signup";
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
id: "APPSMITH_SIGNUP_DISABLED",
|
||||
category: SettingCategories.FORM_AUTH,
|
||||
subCategory: "form signup",
|
||||
controlType: SettingTypes.TOGGLE,
|
||||
label: "Signup",
|
||||
toggleText: (value: boolean) => {
|
||||
if (value) {
|
||||
return "Allow invited users to signup";
|
||||
} else {
|
||||
return " Allow all users to signup";
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const Google_Auth: AdminConfigType = {
|
||||
type: SettingCategories.GOOGLE_AUTH,
|
||||
controlType: SettingTypes.GROUP,
|
||||
title: "Google Authentication",
|
||||
subText: "Enable your organization to sign in with Google (OAuth).",
|
||||
canSave: true,
|
||||
settings: [
|
||||
{
|
||||
id: "APPSMITH_OAUTH2_GOOGLE_READ_MORE",
|
||||
category: SettingCategories.GOOGLE_AUTH,
|
||||
subCategory: "google signup",
|
||||
controlType: SettingTypes.LINK,
|
||||
label: "How to configure?",
|
||||
url: GOOGLE_SIGNUP_SETUP_DOC,
|
||||
},
|
||||
{
|
||||
id: "APPSMITH_OAUTH2_GOOGLE_CLIENT_ID",
|
||||
category: SettingCategories.GOOGLE_AUTH,
|
||||
subCategory: "google signup",
|
||||
controlType: SettingTypes.TEXTINPUT,
|
||||
controlSubType: SettingSubtype.TEXT,
|
||||
label: "Client ID",
|
||||
},
|
||||
{
|
||||
id: "APPSMITH_OAUTH2_GOOGLE_CLIENT_SECRET",
|
||||
category: SettingCategories.GOOGLE_AUTH,
|
||||
subCategory: "google signup",
|
||||
controlType: SettingTypes.TEXTINPUT,
|
||||
controlSubType: SettingSubtype.TEXT,
|
||||
label: "Client Secret",
|
||||
},
|
||||
{
|
||||
id: "APPSMITH_SIGNUP_ALLOWED_DOMAINS",
|
||||
category: SettingCategories.GOOGLE_AUTH,
|
||||
subCategory: "google signup",
|
||||
controlType: SettingTypes.TEXTINPUT,
|
||||
controlSubType: SettingSubtype.TEXT,
|
||||
label: "Allowed Domains",
|
||||
placeholder: "domain1.com, domain2.com",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const Github_Auth: AdminConfigType = {
|
||||
type: SettingCategories.GITHUB_AUTH,
|
||||
controlType: SettingTypes.GROUP,
|
||||
title: "Github Authentication",
|
||||
subText:
|
||||
"Enable your organization to sign in with Github SAML single sign-on (SSO).",
|
||||
canSave: true,
|
||||
settings: [
|
||||
{
|
||||
id: "APPSMITH_OAUTH2_GITHUB_READ_MORE",
|
||||
category: SettingCategories.GITHUB_AUTH,
|
||||
subCategory: "github signup",
|
||||
controlType: SettingTypes.LINK,
|
||||
label: "How to configure?",
|
||||
url: GITHUB_SIGNUP_SETUP_DOC,
|
||||
},
|
||||
{
|
||||
id: "APPSMITH_OAUTH2_GITHUB_CLIENT_ID",
|
||||
category: SettingCategories.GITHUB_AUTH,
|
||||
subCategory: "github signup",
|
||||
controlType: SettingTypes.TEXTINPUT,
|
||||
controlSubType: SettingSubtype.TEXT,
|
||||
label: "Client ID",
|
||||
},
|
||||
{
|
||||
id: "APPSMITH_OAUTH2_GITHUB_CLIENT_SECRET",
|
||||
category: SettingCategories.GITHUB_AUTH,
|
||||
subCategory: "github signup",
|
||||
controlType: SettingTypes.TEXTINPUT,
|
||||
controlSubType: SettingSubtype.TEXT,
|
||||
label: "Client Secret",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export const Form_Auth_Callout: AuthMethodType = {
|
||||
id: "APPSMITH_FORM_LOGIN_AUTH",
|
||||
category: SettingCategories.FORM_AUTH,
|
||||
label: "Form Login",
|
||||
subText: "Enable your organization to sign in with Appsmith Form.",
|
||||
image: Lock,
|
||||
type: "LINK",
|
||||
isConnected: !disableLoginForm,
|
||||
};
|
||||
|
||||
export const Google_Auth_Callout: AuthMethodType = {
|
||||
id: "APPSMITH_GOOGLE_AUTH",
|
||||
category: SettingCategories.GOOGLE_AUTH,
|
||||
label: "Google",
|
||||
subText: "Enable your organization to sign in with Google (OAuth).",
|
||||
image: Google,
|
||||
type: "LINK",
|
||||
isConnected: enableGoogleOAuth,
|
||||
};
|
||||
|
||||
export const Github_Auth_Callout: AuthMethodType = {
|
||||
id: "APPSMITH_GITHUB_AUTH",
|
||||
category: SettingCategories.GITHUB_AUTH,
|
||||
label: "Github",
|
||||
subText:
|
||||
"Enable your organization to sign in with Github SAML single sign-on (SSO).",
|
||||
image: Github,
|
||||
type: "LINK",
|
||||
isConnected: enableGithubOAuth,
|
||||
};
|
||||
|
||||
export const Saml_Auth_Callout: AuthMethodType = {
|
||||
id: "APPSMITH_SAML_AUTH",
|
||||
label: "SAML 2.0",
|
||||
subText: `Enable your organization to sign in with your preferred SAML2 compliant provider.`,
|
||||
image: SamlSso,
|
||||
needsUpgrade: true,
|
||||
type: "OTHER",
|
||||
};
|
||||
|
||||
export const Oidc_Auth_Callout: AuthMethodType = {
|
||||
id: "APPSMITH_OIDC_AUTH",
|
||||
label: "OIDC",
|
||||
subText: `Enable your organization to sign in with Open ID Connect.`,
|
||||
image: OIDC,
|
||||
needsUpgrade: true,
|
||||
type: "OTHER",
|
||||
};
|
||||
|
||||
const AuthMethods = [
|
||||
Oidc_Auth_Callout,
|
||||
Saml_Auth_Callout,
|
||||
Google_Auth_Callout,
|
||||
Github_Auth_Callout,
|
||||
Form_Auth_Callout,
|
||||
];
|
||||
|
||||
function AuthMain() {
|
||||
return <AuthPage authMethods={AuthMethods} />;
|
||||
}
|
||||
|
||||
export const config: AdminConfigType = {
|
||||
type: SettingCategories.AUTHENTICATION,
|
||||
controlType: SettingTypes.PAGE,
|
||||
title: "Authentication",
|
||||
canSave: false,
|
||||
children: [Form_Auth, Google_Auth, Github_Auth],
|
||||
component: AuthMain,
|
||||
};
|
||||
77
app/client/src/ce/pages/AdminSettings/config/types.ts
Normal file
77
app/client/src/ce/pages/AdminSettings/config/types.ts
Normal file
|
|
@ -0,0 +1,77 @@
|
|||
import React from "react";
|
||||
import { ReduxAction } from "constants/ReduxActionConstants";
|
||||
import { Dispatch } from "react";
|
||||
|
||||
export enum SettingTypes {
|
||||
TEXTINPUT = "TEXTINPUT",
|
||||
TOGGLE = "TOGGLE",
|
||||
LINK = "LINK",
|
||||
BUTTON = "BUTTON",
|
||||
GROUP = "GROUP",
|
||||
TEXT = "TEXT",
|
||||
PAGE = "PAGE",
|
||||
}
|
||||
|
||||
export enum SettingSubtype {
|
||||
EMAIL = "email",
|
||||
TEXT = "text",
|
||||
NUMBER = "number",
|
||||
PASSWORD = "password",
|
||||
}
|
||||
|
||||
export interface Setting {
|
||||
id: string;
|
||||
category?: string;
|
||||
controlType: SettingTypes;
|
||||
controlSubType?: SettingSubtype;
|
||||
helpText?: string;
|
||||
label?: string;
|
||||
name?: string;
|
||||
placeholder?: string;
|
||||
validate?: (value: string, setting?: Setting) => string | void;
|
||||
url?: string;
|
||||
children?: any;
|
||||
subCategory?: string;
|
||||
value?: string;
|
||||
text?: string;
|
||||
action?: (
|
||||
dispatch: Dispatch<ReduxAction<any>>,
|
||||
settings?: Record<string, any>,
|
||||
) => void;
|
||||
sortOrder?: number;
|
||||
subText?: string;
|
||||
toggleText?: (value: boolean) => string;
|
||||
isVisible?: (values: Record<string, any>) => boolean;
|
||||
isHidden?: boolean;
|
||||
isDisabled?: (values: Record<string, any>) => boolean;
|
||||
}
|
||||
|
||||
export interface Category {
|
||||
title: string;
|
||||
slug: string;
|
||||
subText?: string;
|
||||
children?: Category[];
|
||||
}
|
||||
|
||||
export const SettingCategories = {
|
||||
GENERAL: "general",
|
||||
EMAIL: "email",
|
||||
GOOGLE_MAPS: "google-maps",
|
||||
VERSION: "version",
|
||||
ADVANCED: "advanced",
|
||||
AUTHENTICATION: "authentication",
|
||||
FORM_AUTH: "form-login",
|
||||
GOOGLE_AUTH: "google-auth",
|
||||
GITHUB_AUTH: "github-auth",
|
||||
};
|
||||
|
||||
export type AdminConfigType = {
|
||||
type: string;
|
||||
controlType: SettingTypes;
|
||||
title: string;
|
||||
subText?: string;
|
||||
settings?: Setting[];
|
||||
component?: React.ElementType;
|
||||
children?: AdminConfigType[];
|
||||
canSave: boolean;
|
||||
};
|
||||
|
|
@ -23,7 +23,7 @@ import {
|
|||
LOGIN_PAGE_INVALID_CREDS_FORGOT_PASSWORD_LINK,
|
||||
NEW_TO_APPSMITH,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import FormMessage from "components/ads/formFields/FormMessage";
|
||||
import FormGroup from "components/ads/formFields/FormGroup";
|
||||
import FormTextField from "components/ads/formFields/TextField";
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ import {
|
|||
SIGNUP_PAGE_SUBMIT_BUTTON_TEXT,
|
||||
ALREADY_HAVE_AN_ACCOUNT,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import FormMessage from "components/ads/formFields/FormMessage";
|
||||
import FormGroup from "components/ads/formFields/FormGroup";
|
||||
import FormTextField from "components/ads/formFields/TextField";
|
||||
|
|
|
|||
|
|
@ -23,7 +23,10 @@ import { setShouldShowResolvedComments } from "actions/commentActions";
|
|||
import { useSelectCommentThreadUsingQuery } from "../inlineComments/Comments";
|
||||
import { Toaster } from "components/ads/Toast";
|
||||
import { Variant } from "components/ads/common";
|
||||
import { COMMENT_HAS_BEEN_DELETED, createMessage } from "constants/messages";
|
||||
import {
|
||||
COMMENT_HAS_BEEN_DELETED,
|
||||
createMessage,
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
const Container = styled.div`
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
import { COMMENTS, createMessage } from "constants/messages";
|
||||
import { COMMENTS, createMessage } from "@appsmith/constants/messages";
|
||||
|
||||
import AppCommentsFilterPopover from "./AppCommentsFilterPopover";
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import styled from "styled-components";
|
|||
import {
|
||||
NO_COMMENTS_CLICK_ON_CANVAS_TO_ADD,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import Icon, { IconSize } from "components/ads/Icon";
|
||||
|
||||
const Container = styled.div`
|
||||
|
|
|
|||
|
|
@ -48,7 +48,10 @@ import {
|
|||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { commentThreadsSelector } from "selectors/commentsSelectors";
|
||||
import { getCurrentUser } from "selectors/usersSelectors";
|
||||
import { createMessage, LINK_COPIED_SUCCESSFULLY } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
LINK_COPIED_SUCCESSFULLY,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { Variant } from "components/ads/common";
|
||||
import TourTooltipWrapper from "components/ads/tour/TourTooltipWrapper";
|
||||
import { TourType } from "entities/Tour";
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import {
|
|||
createMessage,
|
||||
EDIT_COMMENT,
|
||||
MORE_OPTIONS,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { noop } from "lodash";
|
||||
|
||||
import "@blueprintjs/popover2/lib/css/blueprint-popover2.css";
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import {
|
|||
createMessage,
|
||||
RESOLVE_THREAD,
|
||||
RESOLVED_THREAD,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
||||
const Container = styled.div`
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { Theme } from "constants/DefaultTheme";
|
|||
import React from "react";
|
||||
import styled, { withTheme } from "styled-components";
|
||||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
import { VIEW_LATEST, createMessage } from "constants/messages";
|
||||
import { VIEW_LATEST, createMessage } from "@appsmith/constants/messages";
|
||||
|
||||
const Container = styled.div`
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -7,7 +7,11 @@ import FormTextField from "components/ads/formFields/TextField";
|
|||
|
||||
import UserProfileImagePicker from "components/ads/UserProfileImagePicker";
|
||||
|
||||
import { createMessage, DISPLAY_NAME, EMAIL_ADDRESS } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
DISPLAY_NAME,
|
||||
EMAIL_ADDRESS,
|
||||
} from "@appsmith/constants/messages";
|
||||
import styled from "styled-components";
|
||||
|
||||
import { isEmail, isEmptyString } from "utils/formhelpers";
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ import {
|
|||
CANCEL,
|
||||
POST,
|
||||
INVALID_EMAIL,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
import { setShowAppInviteUsersDialog } from "actions/applicationActions";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
|
|
|
|||
117
app/client/src/components/ads/Breadcrumbs.tsx
Normal file
117
app/client/src/components/ads/Breadcrumbs.tsx
Normal file
|
|
@ -0,0 +1,117 @@
|
|||
import React, { ReactNode } from "react";
|
||||
import { Link, useLocation } from "react-router-dom";
|
||||
import styled from "styled-components";
|
||||
import Icon from "./Icon";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
||||
export interface BreadcrumbsProps {
|
||||
items: {
|
||||
href: string;
|
||||
text: string;
|
||||
}[];
|
||||
}
|
||||
export interface BreadcrumbProps {
|
||||
children: ReactNode;
|
||||
}
|
||||
|
||||
export const StyledBreadcrumbList = styled.ol`
|
||||
list-style: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
color: #716e6e;
|
||||
margin-bottom: 23px;
|
||||
|
||||
.breadcrumb-separator {
|
||||
color: #716e6e;
|
||||
margin: auto 6px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.t--breadcrumb-item {
|
||||
&.active {
|
||||
color: ${Colors.COD_GRAY};
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
function BreadcrumbSeparator({ children, ...props }: { children: ReactNode }) {
|
||||
return (
|
||||
<li className="breadcrumb-separator" {...props}>
|
||||
{children}
|
||||
</li>
|
||||
);
|
||||
}
|
||||
|
||||
function BreadcrumbItem({ children, ...props }: { children: ReactNode }) {
|
||||
return (
|
||||
<li className="breadcrumb-item" {...props}>
|
||||
{children}
|
||||
</li>
|
||||
);
|
||||
}
|
||||
|
||||
function BreadcrumbList(props: BreadcrumbProps) {
|
||||
let children = React.Children.toArray(props.children);
|
||||
|
||||
children = children.map((child, index) => (
|
||||
<BreadcrumbItem key={`breadcrumb_item${index}`}>{child}</BreadcrumbItem>
|
||||
));
|
||||
|
||||
const lastIndex = children.length - 1;
|
||||
|
||||
const childrenNew = children.reduce((acc: ReactNode[], child, index) => {
|
||||
const notLast = index < lastIndex;
|
||||
|
||||
if (notLast) {
|
||||
acc.push(
|
||||
child,
|
||||
<BreadcrumbSeparator key={`breadcrumb_sep${index}`}>
|
||||
<Icon name="right-arrow-2" />
|
||||
</BreadcrumbSeparator>,
|
||||
);
|
||||
} else {
|
||||
acc.push(child);
|
||||
}
|
||||
return acc;
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<StyledBreadcrumbList className="t--breadcrumb-list">
|
||||
{childrenNew}
|
||||
</StyledBreadcrumbList>
|
||||
);
|
||||
}
|
||||
|
||||
function Breadcrumbs(props: BreadcrumbsProps) {
|
||||
const { pathname } = useLocation();
|
||||
return (
|
||||
<BreadcrumbList>
|
||||
{props.items.map(({ href, text }) =>
|
||||
href === pathname ? (
|
||||
<span
|
||||
className={`t--breadcrumb-item ${
|
||||
href === pathname ? `active` : ``
|
||||
}`}
|
||||
key={href}
|
||||
>
|
||||
{text}
|
||||
</span>
|
||||
) : (
|
||||
<Link
|
||||
className={`t--breadcrumb-item ${
|
||||
href === pathname ? `active` : ``
|
||||
}`}
|
||||
key={href}
|
||||
to={href}
|
||||
>
|
||||
{text}
|
||||
</Link>
|
||||
),
|
||||
)}
|
||||
</BreadcrumbList>
|
||||
);
|
||||
}
|
||||
|
||||
export default Breadcrumbs;
|
||||
93
app/client/src/components/ads/CalloutV2.tsx
Normal file
93
app/client/src/components/ads/CalloutV2.tsx
Normal file
|
|
@ -0,0 +1,93 @@
|
|||
import styled from "styled-components";
|
||||
import React from "react";
|
||||
import { ReduxAction } from "constants/ReduxActionConstants";
|
||||
import { Dispatch } from "react";
|
||||
import { useDispatch } from "react-redux";
|
||||
import Icon, { IconSize } from "../../components/ads/Icon";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
||||
export type CalloutType = "Warning" | "Info";
|
||||
|
||||
export const Wrapper = styled.div<{ type?: CalloutType }>`
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 8px 16px;
|
||||
${(props) =>
|
||||
props.type !== "Warning"
|
||||
? `border-left: 5px solid ${Colors.CURIOUS_BLUE};
|
||||
color: #00407d;
|
||||
background: ${Colors.PALE_BLUE};`
|
||||
: `color: #c91818; background: ${Colors.FAIR_PINK};
|
||||
`}
|
||||
margin: 16px 0;
|
||||
|
||||
.warning-icon {
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
}
|
||||
a {
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 11px;
|
||||
line-height: 13px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
letter-spacing: 0.4px;
|
||||
text-transform: uppercase;
|
||||
text-decoration: none;
|
||||
margin: 5px 0;
|
||||
${(props) =>
|
||||
props.type !== "Warning" ? `color: #00407d;` : `color: #c91818;`}
|
||||
`;
|
||||
|
||||
export function Callout(props: {
|
||||
type: CalloutType;
|
||||
title: string;
|
||||
actionLabel?: string;
|
||||
action?: (
|
||||
dispatch: Dispatch<ReduxAction<any>>,
|
||||
settings?: Record<string, any>,
|
||||
) => void;
|
||||
url?: string;
|
||||
}) {
|
||||
const dispatch = useDispatch();
|
||||
const linkProps: Record<string, string | (() => any)> = {};
|
||||
|
||||
if (props.url) {
|
||||
linkProps.href = props.url;
|
||||
linkProps.target = "_blank";
|
||||
} else if (props.action) {
|
||||
linkProps.onClick = () => {
|
||||
if (props.action) {
|
||||
props.action(dispatch);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
return (
|
||||
<Wrapper type={props.type}>
|
||||
{props.type === "Warning" && (
|
||||
<Icon
|
||||
className="warning-icon"
|
||||
name="warning-line"
|
||||
size={IconSize.XXXXL}
|
||||
/>
|
||||
)}
|
||||
<div>
|
||||
<h4>{props.title}</h4>
|
||||
<a {...linkProps}>
|
||||
{props.actionLabel}
|
||||
<Icon name="right-arrow" size={IconSize.LARGE} />
|
||||
</a>
|
||||
</div>
|
||||
</Wrapper>
|
||||
);
|
||||
}
|
||||
|
|
@ -8,7 +8,7 @@ import { getTypographyByKey } from "constants/DefaultTheme";
|
|||
|
||||
import styled from "styled-components";
|
||||
import ImageEditor from "@uppy/image-editor";
|
||||
import { REMOVE, createMessage } from "constants/messages";
|
||||
import { REMOVE, createMessage } from "@appsmith/constants/messages";
|
||||
|
||||
import "@uppy/core/dist/style.css";
|
||||
import "@uppy/dashboard/dist/style.css";
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { Toaster } from "./Toast";
|
|||
import {
|
||||
createMessage,
|
||||
ERROR_EMPTY_APPLICATION_NAME,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
type EditableTextWrapperProps = EditableTextProps & {
|
||||
variant: "UNDERLINE" | "ICON";
|
||||
|
|
|
|||
|
|
@ -8,7 +8,11 @@ import { Theme } from "constants/DefaultTheme";
|
|||
import "@blueprintjs/popover2/lib/css/blueprint-popover2.css";
|
||||
import "emoji-mart/css/emoji-mart.css";
|
||||
import Tooltip from "components/ads/Tooltip";
|
||||
import { ADD_REACTION, createMessage, EMOJI } from "constants/messages";
|
||||
import {
|
||||
ADD_REACTION,
|
||||
createMessage,
|
||||
EMOJI,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
||||
const StyledIcon = styled(Icon)<{
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import {
|
|||
createMessage,
|
||||
ERROR_FILE_TOO_LARGE,
|
||||
REMOVE_FILE_TOOL_TIP,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { Position } from "@blueprintjs/core/lib/esm/common/position";
|
||||
import Icon, { IconSize } from "./Icon";
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ import {
|
|||
createMessage,
|
||||
ERROR_FILE_TOO_LARGE,
|
||||
REMOVE_FILE_TOOL_TIP,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { Position } from "@blueprintjs/core/lib/esm/common/position";
|
||||
import Icon, { IconSize } from "./Icon";
|
||||
|
|
|
|||
|
|
@ -128,6 +128,7 @@ import ShareForwardIcon from "remixicon-react/ShareForwardFillIcon";
|
|||
import Trash from "remixicon-react/DeleteBinLineIcon";
|
||||
import UpArrow from "remixicon-react/ArrowUpSFillIcon";
|
||||
import WarningIcon from "remixicon-react/ErrorWarningFillIcon";
|
||||
import WarningLineIcon from "remixicon-react/ErrorWarningLineIcon";
|
||||
import EditUnderlineIcon from "remixicon-react/EditLineIcon";
|
||||
import LogoutIcon from "remixicon-react/LogoutBoxRLineIcon";
|
||||
import ShareLineIcon from "remixicon-react/ShareLineIcon";
|
||||
|
|
@ -309,6 +310,7 @@ export const IconCollection = [
|
|||
"view-less",
|
||||
"wand",
|
||||
"warning",
|
||||
"warning-line",
|
||||
"warning-triangle",
|
||||
"workspace",
|
||||
"git-branch",
|
||||
|
|
@ -721,6 +723,9 @@ const Icon = forwardRef(
|
|||
case "warning":
|
||||
returnIcon = <WarningIcon />;
|
||||
break;
|
||||
case "warning-line":
|
||||
returnIcon = <WarningLineIcon />;
|
||||
break;
|
||||
case "warning-triangle":
|
||||
returnIcon = <WarningTriangleIcon />;
|
||||
break;
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import { EntryComponentProps } from "@draft-js-plugins/mention/lib/MentionSugges
|
|||
|
||||
import Icon from "components/ads/Icon";
|
||||
|
||||
import { INVITE_A_NEW_USER, createMessage } from "constants/messages";
|
||||
import { INVITE_A_NEW_USER, createMessage } from "@appsmith/constants/messages";
|
||||
import { USER_PHOTO_URL } from "constants/userConstants";
|
||||
|
||||
import scrollIntoView from "scroll-into-view-if-needed";
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import React, { useState, useCallback, useEffect } from "react";
|
|||
import Button, { Category, Size } from "components/ads/Button";
|
||||
|
||||
import styled from "styled-components";
|
||||
import { createMessage, NEXT, BACK, SKIP } from "constants/messages";
|
||||
import { createMessage, NEXT, BACK, SKIP } from "@appsmith/constants/messages";
|
||||
import { useTransition, animated } from "react-spring";
|
||||
import Icon from "./Icon";
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import Button from "components/ads/Button";
|
||||
import styled from "constants/DefaultTheme";
|
||||
import { createMessage, SNIPPET_TOOLTIP } from "constants/messages";
|
||||
import { createMessage, SNIPPET_TOOLTIP } from "@appsmith/constants/messages";
|
||||
import { ENTITY_TYPE } from "entities/DataTree/dataTreeFactory";
|
||||
import React from "react";
|
||||
import { useDispatch } from "react-redux";
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { Intent } from "constants/DefaultTheme";
|
|||
import {
|
||||
createMessage,
|
||||
INVITE_USERS_VALIDATION_EMAIL_LIST,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { isEmail } from "utils/formhelpers";
|
||||
import { Colors } from "constants/Colors";
|
||||
const TagInputWrapper = styled.div<{ intent?: Intent }>`
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ import {
|
|||
ERROR_MESSAGE_NAME_EMPTY,
|
||||
createMessage,
|
||||
FORM_VALIDATION_INVALID_EMAIL,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { isEmail } from "utils/formhelpers";
|
||||
import Icon, { IconCollection, IconName, IconSize } from "./Icon";
|
||||
import { AsyncControllableInput } from "@blueprintjs/core/lib/esm/components/forms/asyncControllableInput";
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ const StyledFormGroup = styled(FormGroup)<FormGroupProps>`
|
|||
& {
|
||||
width: ${(props) => (props.fill ? "100%" : "auto")};
|
||||
&.${Classes.FORM_GROUP} {
|
||||
margin: 0 0 ${(props) => props.theme.spaces[5]}px;
|
||||
margin: 0 0 ${(props) => props.theme.spaces[11]}px;
|
||||
}
|
||||
&.${Classes.FORM_GROUP} .${Classes.FORM_HELPER_TEXT} {
|
||||
font-size: ${(props) => props.theme.fontSizes[3]}px;
|
||||
|
|
|
|||
|
|
@ -19,9 +19,11 @@ const renderComponent = (
|
|||
return (
|
||||
<>
|
||||
<InputComponent {...componentProps} {...componentProps.input} fill />
|
||||
{!componentProps.hideErrorMessage && (
|
||||
<FormFieldError error={showError && componentProps.meta.error} />
|
||||
)}
|
||||
{!componentProps.hideErrorMessage &&
|
||||
showError &&
|
||||
componentProps.meta.error && (
|
||||
<FormFieldError error={showError && componentProps.meta.error} />
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -20,7 +20,10 @@ import { User } from "constants/userConstants";
|
|||
import { bootIntercom } from "utils/helpers";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { Position } from "@blueprintjs/core";
|
||||
import { createMessage, HELP_RESOURCE_TOOLTIP } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
HELP_RESOURCE_TOOLTIP,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { TOOLTIP_HOVER_ON_DELAY } from "constants/AppConstants";
|
||||
|
||||
const { algolia } = getAppsmithConfigs();
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@ import {
|
|||
STOP_WATCH_GEO_LOCATION,
|
||||
STORE_VALUE,
|
||||
WATCH_GEO_LOCATION,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { toggleShowGlobalSearchModal } from "actions/globalSearchActions";
|
||||
import { filterCategories, SEARCH_CATEGORY_ID } from "../GlobalSearch/utils";
|
||||
import { ActionDataState } from "reducers/entityReducers/actionsReducer";
|
||||
|
|
|
|||
|
|
@ -16,7 +16,10 @@ import { Classes } from "@blueprintjs/core";
|
|||
import { getAction, getPlugin } from "selectors/entitiesSelector";
|
||||
import { Plugin } from "api/PluginApi";
|
||||
import NameEditorComponent from "components/utils/NameEditorComponent";
|
||||
import { ACTION_NAME_PLACEHOLDER, createMessage } from "constants/messages";
|
||||
import {
|
||||
ACTION_NAME_PLACEHOLDER,
|
||||
createMessage,
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
const ApiNameWrapper = styled.div<{ page?: string }>`
|
||||
min-width: 50%;
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ import {
|
|||
NO_INCOMING_ENTITIES,
|
||||
NO_OUTGOING_ENTITIES,
|
||||
OUTGOING_ENTITIES,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { Connection } from "../Debugger/EntityDependecies";
|
||||
|
||||
const ConnectionType = styled.span`
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ import {
|
|||
createMessage,
|
||||
SUGGESTED_WIDGETS,
|
||||
SUGGESTED_WIDGET_TOOLTIP,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { SuggestedWidget } from "api/ActionAPI";
|
||||
|
||||
import { useSelector } from "store";
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ import {
|
|||
BACK_TO_CANVAS,
|
||||
createMessage,
|
||||
NO_CONNECTIONS,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import {
|
||||
SuggestedWidget,
|
||||
SuggestedWidget as SuggestedWidgetsType,
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ import {
|
|||
EMPTY_RESPONSE_FIRST_HALF,
|
||||
EMPTY_RESPONSE_LAST_HALF,
|
||||
INSPECT_ENTITY,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import Text, { TextType } from "components/ads/Text";
|
||||
import { Text as BlueprintText } from "@blueprintjs/core";
|
||||
import Icon from "components/ads/Icon";
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ import {
|
|||
DEBUGGER_OPEN_DOCUMENTATION,
|
||||
DEBUGGER_SEARCH_GOOGLE,
|
||||
DEBUGGER_SEARCH_SNIPPET,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import Icon, { IconName, IconSize } from "components/ads/Icon";
|
||||
import { Classes } from "components/ads/common";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import FilterHeader from "./FilterHeader";
|
|||
import { BlankState } from "./helpers";
|
||||
import LogItem, { getLogItemProps } from "./LogItem";
|
||||
import { usePagination, useFilteredLogs } from "./hooks/debuggerHooks";
|
||||
import { createMessage, NO_LOGS } from "constants/messages";
|
||||
import { createMessage, NO_LOGS } from "@appsmith/constants/messages";
|
||||
import { useSelector } from "react-redux";
|
||||
import { getCurrentUser } from "selectors/usersSelectors";
|
||||
import { bootIntercom } from "utils/helpers";
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { CLICK_ON, createMessage } from "constants/messages";
|
||||
import { CLICK_ON, createMessage } from "@appsmith/constants/messages";
|
||||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
import { DebugButton } from "./DebugCTA";
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ import {
|
|||
DEBUGGER_ERRORS,
|
||||
DEBUGGER_LOGS,
|
||||
INSPECT_ENTITY,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { stopEventPropagation } from "utils/AppsmithUtils";
|
||||
import { DEBUGGER_TAB_KEYS } from "./helpers";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ import {
|
|||
NO_INCOMING_ENTITIES,
|
||||
NO_OUTGOING_ENTITIES,
|
||||
OUTGOING_ENTITIES,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { getDependenciesFromInverseDependencies } from "./helpers";
|
||||
import { useSelectedEntity, useEntityLink } from "./hooks/debuggerHooks";
|
||||
import AnalyticsUtil from "utils/AnalyticsUtil";
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import styled from "styled-components";
|
|||
import { getFilteredErrors } from "selectors/debuggerSelectors";
|
||||
import LogItem, { getLogItemProps } from "./LogItem";
|
||||
import { BlankState } from "./helpers";
|
||||
import { createMessage, NO_ERRORS } from "constants/messages";
|
||||
import { createMessage, NO_ERRORS } from "@appsmith/constants/messages";
|
||||
import { getCurrentUser } from "selectors/usersSelectors";
|
||||
import { bootIntercom } from "utils/helpers";
|
||||
import { thinScrollbar } from "constants/DefaultTheme";
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import { clearLogs } from "actions/debuggerActions";
|
|||
import { Classes } from "components/ads/common";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { Position } from "@blueprintjs/core";
|
||||
import { CLEAR_LOG_TOOLTIP, createMessage } from "constants/messages";
|
||||
import { CLEAR_LOG_TOOLTIP, createMessage } from "@appsmith/constants/messages";
|
||||
import { TOOLTIP_HOVER_ON_DELAY } from "constants/AppConstants";
|
||||
import { Classes as BlueprintClasses } from "@blueprintjs/core";
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,10 @@ import { SeverityIcon } from "./helpers";
|
|||
import Text, { TextType } from "components/ads/Text";
|
||||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { createMessage, TROUBLESHOOT_ISSUE } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
TROUBLESHOOT_ISSUE,
|
||||
} from "@appsmith/constants/messages";
|
||||
import ContextualMenu from "./ContextualMenu";
|
||||
|
||||
const Wrapper = styled.div<{ collapsed: boolean }>`
|
||||
|
|
|
|||
|
|
@ -2,7 +2,11 @@ import { Log, Severity } from "entities/AppsmithConsole";
|
|||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
import { createMessage, OPEN_THE_DEBUGGER, PRESS } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
OPEN_THE_DEBUGGER,
|
||||
PRESS,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { DependencyMap } from "utils/DynamicBindingUtils";
|
||||
import {
|
||||
matchBuilderPath,
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ import {
|
|||
VALID_FUNCTION_NAME_ERROR,
|
||||
UNIQUE_NAME_ERROR,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
const InputContainer = styled.div<{ focused: boolean; isValid: boolean }>`
|
||||
align-items: center;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import styled from "styled-components";
|
|||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
import Text, { TextType } from "components/ads/Text";
|
||||
import { toggleShowGlobalSearchModal } from "actions/globalSearchActions";
|
||||
import { HELPBAR_PLACEHOLDER } from "constants/messages";
|
||||
import { HELPBAR_PLACEHOLDER } from "@appsmith/constants/messages";
|
||||
import AnalyticsUtil from "utils/AnalyticsUtil";
|
||||
import { isMac } from "utils/helpers";
|
||||
import { filterCategories, SEARCH_CATEGORY_ID } from "./utils";
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import React from "react";
|
||||
import styled from "styled-components";
|
||||
import NoSearchDataImage from "assets/images/no_search_data.png";
|
||||
import { NO_SEARCH_DATA_TEXT } from "constants/messages";
|
||||
import { NO_SEARCH_DATA_TEXT } from "@appsmith/constants/messages";
|
||||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
import { ReactComponent as DiscordIcon } from "assets/icons/help/discord.svg";
|
||||
import AnalyticsUtil from "utils/AnalyticsUtil";
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import {
|
|||
OMNIBAR_PLACEHOLDER_DOC,
|
||||
OMNIBAR_PLACEHOLDER_NAV,
|
||||
OMNIBAR_PLACEHOLDER_SNIPPETS,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { isMenu, SearchCategory, SEARCH_CATEGORY_ID } from "./utils";
|
||||
import { ReactComponent as CloseIcon } from "assets/icons/help/close_blue.svg";
|
||||
import { ReactComponent as SearchIcon } from "assets/icons/ads/search.svg";
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ import {
|
|||
SNIPPET_COPY,
|
||||
SNIPPET_EXECUTE,
|
||||
SNIPPET_INSERT,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { getExpectedValue } from "utils/validation/common";
|
||||
import { Toaster } from "components/ads/Toast";
|
||||
import { Variant } from "components/ads/common";
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import {
|
|||
DOC_DESCRIPTION,
|
||||
NAV_DESCRIPTION,
|
||||
SNIPPET_DESCRIPTION,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { ValidationTypes } from "constants/WidgetValidation";
|
||||
import { Datasource } from "entities/Datasource";
|
||||
import { useEffect, useState } from "react";
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import {
|
|||
PARSING_ERROR,
|
||||
EMPTY_RESPONSE_FIRST_HALF,
|
||||
EMPTY_RESPONSE_LAST_HALF,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { EditorTheme } from "./CodeEditor/EditorConfig";
|
||||
import DebuggerLogs from "./Debugger/DebuggerLogs";
|
||||
import ErrorLogs from "./Debugger/Errors";
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
import React from "react";
|
||||
import { IconProps } from "constants/IconConstants";
|
||||
import { createMessage, LIGHTNING_MENU_DATA_TOOLTIP } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
LIGHTNING_MENU_DATA_TOOLTIP,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { Theme, Skin } from "constants/DefaultTheme";
|
||||
import styled from "styled-components";
|
||||
import Icon, { IconSize } from "components/ads/Icon";
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ import {
|
|||
LIGHTNING_MENU_QUERY_CREATE_NEW,
|
||||
LIGHTNING_MENU_API_CREATE_NEW,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { Skin } from "constants/DefaultTheme";
|
||||
import { ReduxAction } from "constants/ReduxActionConstants";
|
||||
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ import {
|
|||
ACTION_INVALID_NAME_ERROR,
|
||||
ACTION_NAME_CONFLICT_ERROR,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
type NameEditorProps = {
|
||||
checkForGuidedTour?: boolean;
|
||||
|
|
|
|||
|
|
@ -93,6 +93,8 @@ export const Colors = {
|
|||
DANUBE: "#6A86CE",
|
||||
FAIR_PINK: "#FFE9E9",
|
||||
OPAQ_BLUE: "rgba(106, 134, 206, 0.1)",
|
||||
PALE_BLUE: "#E8F5FA",
|
||||
CURIOUS_BLUE: "#1D9BD1",
|
||||
RATE_ACTIVE: "#FFCB45",
|
||||
MALIBU: "#7DBCFF",
|
||||
ALABASTER_ALT: "#FAFAFA",
|
||||
|
|
|
|||
|
|
@ -2905,6 +2905,9 @@ export const theme: Theme = {
|
|||
leftPadding: 16,
|
||||
rightMargin: 12,
|
||||
},
|
||||
main: {
|
||||
marginLeft: 112,
|
||||
},
|
||||
search: {
|
||||
height: 68,
|
||||
paddingTop: 30,
|
||||
|
|
|
|||
|
|
@ -428,7 +428,12 @@ export const getOnboardingCheckListUrl = (
|
|||
|
||||
export const ADMIN_SETTINGS_URL = "/settings";
|
||||
export const ADMIN_SETTINGS_CATEGORY_DEFAULT_URL = "/settings/general";
|
||||
export const ADMIN_SETTINGS_CATEGORY_URL = "/settings/:category";
|
||||
export function getAdminSettingsCategoryUrl(category: string) {
|
||||
return `${ADMIN_SETTINGS_URL}/${category}`;
|
||||
export const ADMIN_SETTINGS_CATEGORY_URL = "/settings/:category/:subCategory?";
|
||||
export function getAdminSettingsCategoryUrl(
|
||||
category: string,
|
||||
subCategory?: string,
|
||||
) {
|
||||
return `${ADMIN_SETTINGS_URL}/${category}${
|
||||
subCategory ? "/" + subCategory : ""
|
||||
}`;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -147,6 +147,13 @@ export const typography = {
|
|||
fontWeight: 600,
|
||||
lineHeight: 12,
|
||||
},
|
||||
dangerHeading: {
|
||||
fontStyle: "normal",
|
||||
fontWeight: 500,
|
||||
fontSize: 24,
|
||||
lineHeight: 28,
|
||||
letterSpacing: -0.24,
|
||||
},
|
||||
};
|
||||
|
||||
export type TypographyKeys = keyof typeof typography;
|
||||
|
|
|
|||
1
app/client/src/ee/constants/forms.ts
Normal file
1
app/client/src/ee/constants/forms.ts
Normal file
|
|
@ -0,0 +1 @@
|
|||
export * from "ce/constants/forms";
|
||||
1
app/client/src/ee/constants/messages.ts
Normal file
1
app/client/src/ee/constants/messages.ts
Normal file
|
|
@ -0,0 +1 @@
|
|||
export * from "ce/constants/messages";
|
||||
|
|
@ -0,0 +1 @@
|
|||
export * from "ce/pages/AdminSettings/BreadcrumbCategories";
|
||||
|
|
@ -0,0 +1 @@
|
|||
export * from "ce/pages/AdminSettings/config/authentication/AuthPage";
|
||||
|
|
@ -0,0 +1 @@
|
|||
export * from "ce/pages/AdminSettings/config/authentication/index";
|
||||
1
app/client/src/ee/pages/AdminSettings/config/types.ts
Normal file
1
app/client/src/ee/pages/AdminSettings/config/types.ts
Normal file
|
|
@ -0,0 +1 @@
|
|||
export * from "ce/pages/AdminSettings/config/types";
|
||||
|
|
@ -21,7 +21,10 @@ import {
|
|||
isNotificationsListVisibleSelector,
|
||||
} from "selectors/notificationSelectors";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { createMessage, NOTIFICATIONS_TOOLTIP } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
NOTIFICATIONS_TOOLTIP,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { TOOLTIP_HOVER_ON_DELAY } from "constants/AppConstants";
|
||||
import { Position } from "@blueprintjs/core";
|
||||
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ import {
|
|||
COMMENTS,
|
||||
MARK_ALL_AS_READ,
|
||||
NO_NOTIFICATIONS_TO_SHOW,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
import Button, { Category } from "components/ads/Button";
|
||||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
|
|
|
|||
|
|
@ -1,7 +1,12 @@
|
|||
import React from "react";
|
||||
import { useDispatch } from "react-redux";
|
||||
import styled from "styled-components";
|
||||
import { createMessage, EDIT_APP, FORK_APP, SIGN_IN } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
EDIT_APP,
|
||||
FORK_APP,
|
||||
SIGN_IN,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { ANONYMOUS_USERNAME } from "constants/userConstants";
|
||||
import { getTypographyByKey } from "constants/DefaultTheme";
|
||||
import Button, { IconPositions } from "components/ads/Button";
|
||||
|
|
|
|||
|
|
@ -54,7 +54,7 @@ import { Toaster } from "components/ads/Toast";
|
|||
import { Variant } from "components/ads/common";
|
||||
import { getExportAppAPIRoute } from "@appsmith/constants/ApiConstants";
|
||||
import { Colors } from "constants/Colors";
|
||||
import { CONNECTED_TO_GIT, createMessage } from "constants/messages";
|
||||
import { CONNECTED_TO_GIT, createMessage } from "@appsmith/constants/messages";
|
||||
|
||||
type NameWrapperProps = {
|
||||
hasReadPermission: boolean;
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import {
|
|||
createMessage,
|
||||
ERROR_MESSAGE_NAME_EMPTY,
|
||||
NAME_SPACE_ERROR,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { AppState } from "reducers";
|
||||
import {
|
||||
CreateApplicationFormValues,
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import { useDispatch } from "react-redux";
|
|||
import { importApplication } from "actions/applicationActions";
|
||||
import { Toaster } from "components/ads/Toast";
|
||||
import { Variant } from "components/ads/common";
|
||||
import { IMPORT_APPLICATION_MODAL_TITLE } from "constants/messages";
|
||||
import { IMPORT_APPLICATION_MODAL_TITLE } from "@appsmith/constants/messages";
|
||||
import FilePickerV2 from "components/ads/FilePickerV2";
|
||||
|
||||
const ImportButton = styled(Button)<{ disabled?: boolean }>`
|
||||
|
|
|
|||
|
|
@ -86,7 +86,7 @@ import {
|
|||
SEARCH_APPS,
|
||||
WELCOME_TOUR,
|
||||
NO_APPS_FOUND,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { ReactComponent as NoAppsFoundIcon } from "assets/svg/no-apps-icon.svg";
|
||||
|
||||
import { howMuchTimeBeforeText } from "utils/helpers";
|
||||
|
|
|
|||
|
|
@ -26,7 +26,7 @@ import {
|
|||
SAVE_DATASOURCE,
|
||||
SAVE_DATASOURCE_MESSAGE,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
interface ReduxStateProps {
|
||||
datasource: EmbeddedRestDatasource | Datasource;
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ import {
|
|||
API_EDITOR_TAB_TITLES,
|
||||
createMessage,
|
||||
WIDGET_BIND_HELP,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import AnalyticsUtil from "utils/AnalyticsUtil";
|
||||
import CloseEditor from "components/editorComponents/CloseEditor";
|
||||
import { useParams } from "react-router";
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import Button, { Category, Size } from "components/ads/Button";
|
|||
import {
|
||||
createMessage,
|
||||
QUERY_CONFIRMATION_MODAL_MESSAGE,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
type Props = {
|
||||
isModalOpen: boolean;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import styled from "styled-components";
|
|||
import Button from "components/ads/Button";
|
||||
import { createNewApiName, createNewQueryName } from "utils/AppsmithUtils";
|
||||
import { Toaster } from "components/ads/Toast";
|
||||
import { ERROR_ADD_API_INVALID_URL } from "constants/messages";
|
||||
import { ERROR_ADD_API_INVALID_URL } from "@appsmith/constants/messages";
|
||||
import { Classes, Variant } from "components/ads/common";
|
||||
import { DEFAULT_API_ACTION_CONFIG } from "constants/ApiEditorConstants";
|
||||
import { createActionRequest } from "actions/pluginActionActions";
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ import {
|
|||
REST_API_AUTHORIZATION_APPSMITH_ERROR,
|
||||
REST_API_AUTHORIZATION_FAILED,
|
||||
REST_API_AUTHORIZATION_SUCCESSFUL,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import Collapsible from "./Collapsible";
|
||||
import _ from "lodash";
|
||||
import FormLabel from "components/editorComponents/FormLabel";
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ import {
|
|||
DEPLOY_MENU_OPTION,
|
||||
CONNECT_TO_GIT_OPTION,
|
||||
CURRENT_DEPLOY_PREVIEW_OPTION,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { getCurrentApplicationId } from "selectors/editorSelectors";
|
||||
import { redoAction, undoAction } from "actions/pageActions";
|
||||
import { redoShortCut, undoShortCut } from "utils/helpers";
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ import {
|
|||
RENAME_APPLICATION_TOOLTIP,
|
||||
SHARE_BUTTON_TOOLTIP,
|
||||
SHARE_BUTTON_TOOLTIP_WITH_USER,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { TOOLTIP_HOVER_ON_DELAY } from "constants/AppConstants";
|
||||
import { ReactComponent as MenuIcon } from "assets/icons/header/hamburger.svg";
|
||||
import { getExplorerPinned } from "selectors/explorerSelector";
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ import { getIsPageSaving, getPageSavingError } from "selectors/editorSelectors";
|
|||
import {
|
||||
createMessage,
|
||||
EDITOR_HEADER_SAVE_INDICATOR,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { Colors } from "constants/Colors";
|
||||
import Icon from "components/ads/Icon";
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import {
|
|||
PAGE_NOT_FOUND_ERROR,
|
||||
INVALID_URL_ERROR,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
import { useHistory } from "react-router-dom";
|
||||
|
||||
const Wrapper = styled.div`
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ import {
|
|||
CONTEXT_NO_PAGE,
|
||||
CONTEXT_SHOW_BINDING,
|
||||
createMessage,
|
||||
} from "constants/messages";
|
||||
} from "@appsmith/constants/messages";
|
||||
|
||||
type EntityContextMenuProps = {
|
||||
id: string;
|
||||
|
|
|
|||
|
|
@ -6,7 +6,10 @@ import { EntityTogglesWrapper } from "./ExplorerStyledComponents";
|
|||
import styled from "styled-components";
|
||||
import { Colors } from "constants/Colors";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { createMessage, ENTITY_MORE_ACTIONS_TOOLTIP } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
ENTITY_MORE_ACTIONS_TOOLTIP,
|
||||
} from "@appsmith/constants/messages";
|
||||
import { TOOLTIP_HOVER_ON_DELAY } from "constants/AppConstants";
|
||||
import { Position } from "@blueprintjs/core";
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,10 @@ import Entity from "./Entity";
|
|||
import history from "utils/history";
|
||||
import { INTEGRATION_EDITOR_URL, INTEGRATION_TABS } from "constants/routes";
|
||||
import EntityPlaceholder from "./Entity/Placeholder";
|
||||
import { createMessage, CREATE_DATASOURCE_TOOLTIP } from "constants/messages";
|
||||
import {
|
||||
createMessage,
|
||||
CREATE_DATASOURCE_TOOLTIP,
|
||||
} from "@appsmith/constants/messages";
|
||||
import styled from "styled-components";
|
||||
import ArrowRightLineIcon from "remixicon-react/ArrowRightLineIcon";
|
||||
import { Colors } from "constants/Colors";
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ import { Colors } from "constants/Colors";
|
|||
import { Skin } from "constants/DefaultTheme";
|
||||
import { EntityClassNames } from ".";
|
||||
import TooltipComponent from "components/ads/Tooltip";
|
||||
import { COPY_ELEMENT, createMessage } from "constants/messages";
|
||||
import { COPY_ELEMENT, createMessage } from "@appsmith/constants/messages";
|
||||
import { TOOLTIP_HOVER_ON_DELAY } from "constants/AppConstants";
|
||||
import CollapseToggle from "./CollapseToggle";
|
||||
import { ReactComponent as CopyIcon } from "assets/icons/menu/copy-snippet.svg";
|
||||
|
|
|
|||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user