From d740954f3cf6e25a1cce0a4408e315600f30bbf9 Mon Sep 17 00:00:00 2001
From: Ashutosh <bhardwajashu96@hotmail.com>
Date: Fri, 26 Jun 2020 07:54:57 +0530
Subject: [PATCH] feat(app-page-builder): add `useConfigureDomainDialog` hook

---
 .../src/utils/configureDomain.tsx             | 50 +++++++++++++++----
 1 file changed, 39 insertions(+), 11 deletions(-)

diff --git a/packages/app-page-builder/src/utils/configureDomain.tsx b/packages/app-page-builder/src/utils/configureDomain.tsx
index f008b20dbaa..566be53feca 100644
--- a/packages/app-page-builder/src/utils/configureDomain.tsx
+++ b/packages/app-page-builder/src/utils/configureDomain.tsx
@@ -1,6 +1,7 @@
 import React from "react";
 import { css } from "emotion";
-import {i18n} from "@webiny/app/i18n";
+import { i18n } from "@webiny/app/i18n";
+import { useDialog } from "@webiny/app-admin/hooks/useDialog";
 
 const t = i18n.ns("app-page-builder/utils");
 
@@ -13,13 +14,40 @@ const confirmationMessageStyles = css({
 
 export const configureDomainTitle = t`Configure domain`;
 
-export const ConfigureDomainMessage = ({ domain }) => (
-    <span className={confirmationMessageStyles}>
-        No site is running at <strong>{domain}</strong>
-        <br />
-        Either start the server by <code>cd apps/site && yarn start</code>
-        <br />
-        or update the domain by going into{" "}
-        <a href={"/settings/page-builder/general"}>page builder settings</a>
-    </span>
-);
+export const ConfigureDomainMessage = ({ domain }) => {
+    const isLocalHost = domain && domain.includes("localhost");
+    return (
+        <span className={confirmationMessageStyles}>
+            No site is running at <strong>{domain}</strong>
+            <br />
+            {isLocalHost ? (
+                <span>
+                    Either start the server by <code>cd apps/site && yarn start</code>{" "}
+                </span>
+            ) : (
+                <span>
+                    Either deploy the site by running <code>yarn webiny deploy apps</code>{" "}
+                </span>
+            )}
+            <br />
+            or update the domain by going into{" "}
+            <a href={"/settings/page-builder/general"}>page builder settings</a>
+        </span>
+    );
+};
+
+export const useConfigureDomainDialog = (domain, onAccept = null) => {
+    const { showDialog } = useDialog();
+
+    return {
+        showConfigureDomainDialog: () => {
+            showDialog(<ConfigureDomainMessage domain={domain} />, {
+                title: configureDomainTitle,
+                actions: {
+                    accept: { label: "Refresh", onClick: onAccept },
+                    cancel: { label: "Cancel" }
+                }
+            });
+        }
+    };
+};