diff --git a/locale/defaultMessages.json b/locale/defaultMessages.json index 831f64e4c..ea64179b8 100644 --- a/locale/defaultMessages.json +++ b/locale/defaultMessages.json @@ -35,10 +35,6 @@ "context": "order shipping method name", "string": "Shipping" }, - "+FWlRD": { - "context": "button", - "string": "Open app" - }, "+HuipK": { "context": "variant sku", "string": "SKU {sku}" @@ -1812,10 +1808,6 @@ "context": "header", "string": "Activity" }, - "BYGJ/j": { - "context": "button label", - "string": "Settings" - }, "BYTvv/": { "context": "Dry run events unavailable", "string": "The following events from provided query are currently not available for dry run:" @@ -3298,6 +3290,10 @@ "context": "button", "string": "Create order" }, + "LwX0Ug": { + "context": "Button with Manage app label", + "string": "Manage app" + }, "Lx1ima": { "context": "button", "string": "Upload image" diff --git a/src/apps/components/AppDetailsPage/AppDetailsPage.stories.tsx b/src/apps/components/AppDetailsPage/AppDetailsPage.stories.tsx index 992b50368..bbdf5e35d 100644 --- a/src/apps/components/AppDetailsPage/AppDetailsPage.stories.tsx +++ b/src/apps/components/AppDetailsPage/AppDetailsPage.stories.tsx @@ -6,7 +6,6 @@ import AppDetailsPage, { AppDetailsPageProps } from "./AppDetailsPage"; const props: AppDetailsPageProps = { data: appDetails, loading: false, - navigateToApp: () => undefined, onAppActivateOpen: () => undefined, onAppDeactivateOpen: () => undefined, onAppDeleteOpen: () => undefined, diff --git a/src/apps/components/AppDetailsPage/AppDetailsPage.test.tsx b/src/apps/components/AppDetailsPage/AppDetailsPage.test.tsx index ebd1e855a..0106a4bc8 100644 --- a/src/apps/components/AppDetailsPage/AppDetailsPage.test.tsx +++ b/src/apps/components/AppDetailsPage/AppDetailsPage.test.tsx @@ -38,7 +38,6 @@ beforeEach(() => { describe("Apps AppDetailsPage", () => { it("displays app details when app data passed", () => { // Arrange - const navigateToApp = jest.fn(); const onAppActivateOpen = jest.fn(); const onAppDeactivateOpen = jest.fn(); const onAppDeleteOpen = jest.fn(); @@ -48,7 +47,6 @@ describe("Apps AppDetailsPage", () => { { // Assert expect(mockHeader).toHaveBeenCalledWith({ data: appDetails, - navigateToApp, onAppActivateOpen, onAppDeactivateOpen, onAppDeleteOpen, diff --git a/src/apps/components/AppDetailsPage/AppDetailsPage.tsx b/src/apps/components/AppDetailsPage/AppDetailsPage.tsx index 7b7ad8fca..8c600e200 100644 --- a/src/apps/components/AppDetailsPage/AppDetailsPage.tsx +++ b/src/apps/components/AppDetailsPage/AppDetailsPage.tsx @@ -10,7 +10,6 @@ import PermissionsCard from "./PermissionsCard"; export interface AppDetailsPageProps { loading: boolean; data: AppQuery["app"]; - navigateToApp: () => void; onAppActivateOpen: () => void; onAppDeactivateOpen: () => void; onAppDeleteOpen: () => void; @@ -19,7 +18,6 @@ export interface AppDetailsPageProps { export const AppDetailsPage: React.FC = ({ data, loading, - navigateToApp, onAppActivateOpen, onAppDeactivateOpen, onAppDeleteOpen, @@ -27,7 +25,6 @@ export const AppDetailsPage: React.FC = ({ <>
({ TopNav: props => { @@ -14,12 +13,6 @@ jest.mock("@dashboard/components/AppLayout/TopNav", () => ({ return <>{props.children}; }, })); -jest.mock("@saleor/macaw-ui/next", () => ({ - Button: props => { - mockButton(props); - return <>{props.children}; - }, -})); jest.mock("../DeactivatedText", () => () => "deactivated"); jest.mock("react-intl", () => ({ useIntl: jest.fn(() => ({ @@ -36,13 +29,11 @@ jest.mock("./HeaderOptions", () => props => { beforeEach(() => { mockHeaderOptions.mockClear(); mockTopNav.mockClear(); - mockButton.mockClear(); }); describe("Apps AppDetailsPage Header", () => { it("displays app details options when active app data passed", () => { // Arrange - const navigateToApp = jest.fn(); const onAppActivateOpen = jest.fn(); const onAppDeactivateOpen = jest.fn(); const onAppDeleteOpen = jest.fn(); @@ -51,7 +42,6 @@ describe("Apps AppDetailsPage Header", () => { render(
{ onAppDeactivateOpen, onAppDeleteOpen, }); - expect(mockButton).toHaveBeenCalledWith( - expect.objectContaining({ - onClick: navigateToApp, - }), - ); expect(mockTopNav).toHaveBeenCalled(); expect(title.container).toHaveTextContent(appDetails.name as string); }); it("displays app details options when inactive app data passed", () => { // Arrange - const navigateToApp = jest.fn(); const onAppActivateOpen = jest.fn(); const onAppDeactivateOpen = jest.fn(); const onAppDeleteOpen = jest.fn(); @@ -86,7 +70,6 @@ describe("Apps AppDetailsPage Header", () => { render(
{ onAppDeactivateOpen, onAppDeleteOpen, }); - expect(mockButton).toHaveBeenCalledWith( - expect.objectContaining({ - onClick: navigateToApp, - }), - ); expect(mockTopNav).toHaveBeenCalled(); expect(title.container).toHaveTextContent(`${appDetails.name} deactivated`); }); diff --git a/src/apps/components/AppDetailsPage/Header.tsx b/src/apps/components/AppDetailsPage/Header.tsx index 5e5655b70..b71495c30 100644 --- a/src/apps/components/AppDetailsPage/Header.tsx +++ b/src/apps/components/AppDetailsPage/Header.tsx @@ -1,17 +1,13 @@ -import { AppPaths } from "@dashboard/apps/urls"; +import { AppUrls } from "@dashboard/apps/urls"; import { TopNav } from "@dashboard/components/AppLayout/TopNav"; import { AppQuery } from "@dashboard/graphql"; -import { Button } from "@saleor/macaw-ui/next"; import React from "react"; -import { FormattedMessage } from "react-intl"; import DeactivatedText from "../DeactivatedText"; import HeaderOptions from "./HeaderOptions"; -import messages from "./messages"; interface HeaderProps { data: AppQuery["app"]; - navigateToApp: () => void; onAppActivateOpen: () => void; onAppDeactivateOpen: () => void; onAppDeleteOpen: () => void; @@ -19,30 +15,32 @@ interface HeaderProps { const Header: React.FC = ({ data, - navigateToApp, onAppActivateOpen, onAppDeactivateOpen, onAppDeleteOpen, -}) => ( - <> - - {data?.name} {!data?.isActive && } - - } - > - - - - -); +}) => { + /** + * App is null with first render so fallback with HTML-safe fallback + */ + const backButtonTarget = data?.id ? AppUrls.resolveAppUrl(data.id) : "#"; + + return ( + <> + + {data?.name} {!data?.isActive && } + + } + /> + + + ); +}; export default Header; diff --git a/src/apps/components/AppDetailsPage/messages.ts b/src/apps/components/AppDetailsPage/messages.ts index b5e6fc448..585bc361e 100644 --- a/src/apps/components/AppDetailsPage/messages.ts +++ b/src/apps/components/AppDetailsPage/messages.ts @@ -1,11 +1,6 @@ import { defineMessages } from "react-intl"; export default defineMessages({ - openApp: { - id: "+FWlRD", - defaultMessage: "Open app", - description: "button", - }, supportLink: { id: "Nsk5WL", defaultMessage: "Get support", diff --git a/src/apps/components/AppPage/AppPage.tsx b/src/apps/components/AppPage/AppPage.tsx index f894113ba..c8e29dd56 100644 --- a/src/apps/components/AppPage/AppPage.tsx +++ b/src/apps/components/AppPage/AppPage.tsx @@ -25,6 +25,7 @@ export const AppPage: React.FC = ({ }) => ( = ({ @@ -19,9 +21,15 @@ export const AppPageNav: React.FC = ({ supportUrl, homepageUrl, author, + appId, }) => { const location = useLocation(); const goBackLink = location.state?.from ?? AppUrls.resolveAppListUrl(); + const navigate = useNavigator(); + + const navigateToManageAppScreen = () => { + navigate(AppUrls.resolveAppDetailsUrl(appId)); + }; return ( @@ -55,6 +63,18 @@ export const AppPageNav: React.FC = ({ + {supportUrl && ( - diff --git a/src/apps/components/InstalledAppListRow/messages.ts b/src/apps/components/InstalledAppListRow/messages.ts index fd5054d47..346b36e17 100644 --- a/src/apps/components/InstalledAppListRow/messages.ts +++ b/src/apps/components/InstalledAppListRow/messages.ts @@ -6,11 +6,6 @@ export const messages = defineMessages({ defaultMessage: "Tunnel - development", description: "label", }, - settings: { - id: "BYGJ/j", - defaultMessage: "Settings", - description: "button label", - }, appDisabled: { id: "7u9Ep7", defaultMessage: "Disabled", diff --git a/src/apps/context.ts b/src/apps/context.ts index e82095d8b..3e1da1163 100644 --- a/src/apps/context.ts +++ b/src/apps/context.ts @@ -4,7 +4,6 @@ import React from "react"; export interface AppListContextValues { removeAppInstallation: (installationId: string) => void; retryAppInstallation: (installationId: string) => void; - openAppSettings: (appId: string) => void; } export const AppListContext = React.createContext< diff --git a/src/apps/views/AppDetails/AppDetails.tsx b/src/apps/views/AppDetails/AppDetails.tsx index 9bd5efcca..41338bcd5 100644 --- a/src/apps/views/AppDetails/AppDetails.tsx +++ b/src/apps/views/AppDetails/AppDetails.tsx @@ -154,7 +154,6 @@ export const AppDetails: React.FC = ({ id, params }) => { navigate(AppUrls.resolveAppUrl(id))} onAppActivateOpen={() => openModal("app-activate")} onAppDeactivateOpen={() => openModal("app-deactivate")} onAppDeleteOpen={() => openModal("app-delete")} diff --git a/src/apps/views/AppList/AppList.tsx b/src/apps/views/AppList/AppList.tsx index d07836aee..f5cba7086 100644 --- a/src/apps/views/AppList/AppList.tsx +++ b/src/apps/views/AppList/AppList.tsx @@ -135,7 +135,6 @@ export const AppsList: React.FC = ({ params }) => { () => ({ retryAppInstallation: handleAppInstallRetry, removeAppInstallation: id => openModal("app-installation-remove", { id }), - openAppSettings: id => navigate(AppUrls.resolveAppDetailsUrl(id)), }), [navigate, openModal], );