From 8c8e6d736f8ae0a930fec0abd00daf97651ed80b Mon Sep 17 00:00:00 2001
From: Artur Moczulski <artur.moczulski@gmail.com>
Date: Mon, 28 Oct 2019 00:59:04 -0700
Subject: [PATCH] feature(installer): style installation pages; ref #5

---
 .../classes/RollbarConfigureController.cls    |  17 ++-
 .../main/default/classes/RollbarInstaller.cls |  36 ++++-
 .../components/RemoteSiteHelper.component     |  12 +-
 .../main/default/pages/RollbarConfigure.page  | 118 ++++++++++++++---
 .../pages/RollbarInstallationCheck.page       | 123 ++++++++++++++++--
 5 files changed, 262 insertions(+), 44 deletions(-)

diff --git a/force-app/main/default/classes/RollbarConfigureController.cls b/force-app/main/default/classes/RollbarConfigureController.cls
index 58f31b9..ad0f5d7 100644
--- a/force-app/main/default/classes/RollbarConfigureController.cls
+++ b/force-app/main/default/classes/RollbarConfigureController.cls
@@ -1,6 +1,7 @@
 public with sharing class RollbarConfigureController {
 
     public Map<String, Boolean> checks  { get; private set; }
+    public Boolean installed { get; private set; }
 
     protected RollbarSettings__c settings { get; set; }
     public String accessToken {
@@ -13,6 +14,7 @@ public with sharing class RollbarConfigureController {
     }
 
     public RollbarConfigureController() {
+        this.installed = false;
         this.settings = RollbarSettings__c.getOrgDefaults();
     }
 
@@ -22,7 +24,9 @@ public with sharing class RollbarConfigureController {
 
         RollbarInstaller.install(config);
 
-        return null;
+        PageReference checkPage = new PageReference('/apex/RollbarInstallationCheck');
+        checkPage.setRedirect(true);
+        return checkPage;
     }
 
     public Pagereference check()
@@ -30,7 +34,16 @@ public with sharing class RollbarConfigureController {
         Config config = new Config(this.accessToken, UserInfo.getOrganizationId());
 
         this.checks = RollbarInstaller.check(config);
-        
+
+        Boolean installed = true;
+        for (String key : this.checks.keySet()) {
+            if (!this.checks.get(key)) {
+                installed = false;
+                break;
+            }
+        }
+        this.installed = installed;
+
         return null;
     }
 }
diff --git a/force-app/main/default/classes/RollbarInstaller.cls b/force-app/main/default/classes/RollbarInstaller.cls
index 203d95f..6e78be9 100644
--- a/force-app/main/default/classes/RollbarInstaller.cls
+++ b/force-app/main/default/classes/RollbarInstaller.cls
@@ -1,16 +1,38 @@
 public with sharing class RollbarInstaller {
     
-    public Map<String, Boolean> checks { get; private set; }
-    
     public static Map<String, Boolean> check(Config config)
     {
         Map<String, Boolean> checks = new Map<String, Boolean>();
 
-        checks.put('rollbarApiEndpointAllowed', rollbarApiEndpointAllowed(config.endpoint()));
-        checks.put('rollbarPingSuccessful', rollbarPingSuccessful());
-        checks.put('rollbarEmailServiceSetUp', rollbarEmailServiceSetUp());
-        checks.put('apexNotificationsForwardingSetUp', apexNotificationsForwardingSetUp());
-        checks.put('accessTokenCorrect', accessTokenCorrect(config));
+        try {
+            checks.put('rollbarApiEndpointAllowed', rollbarApiEndpointAllowed(config.endpoint()));
+        } catch (Exception ex) {
+            checks.put('rollbarApiEndpointAllowed', false);
+        }
+
+        try {
+            checks.put('rollbarPingSuccessful', rollbarPingSuccessful());
+        } catch (Exception ex) {
+            checks.put('rollbarPingSuccessful', false);
+        }
+
+        try {
+            checks.put('rollbarEmailServiceSetUp', rollbarEmailServiceSetUp());
+        } catch (Exception ex) {
+            checks.put('rollbarEmailServiceSetUp', false);
+        }
+        
+        try {
+            checks.put('apexNotificationsForwardingSetUp', apexNotificationsForwardingSetUp());
+        } catch (Exception ex) {
+            checks.put('apexNotificationsForwardingSetUp', false);
+        }
+
+        try {
+            checks.put('accessTokenCorrect', accessTokenCorrect(config));
+        } catch (Exception ex) {
+            checks.put('accessTokenCorrect', false);
+        }
 
         return checks;
     }
diff --git a/force-app/main/default/components/RemoteSiteHelper.component b/force-app/main/default/components/RemoteSiteHelper.component
index 7338a2a..ae97646 100644
--- a/force-app/main/default/components/RemoteSiteHelper.component
+++ b/force-app/main/default/components/RemoteSiteHelper.component
@@ -2,11 +2,6 @@
     <apex:attribute name="rssName" type="String" required="true" access="global" assignTo="{!rssNameString}" default="mdapi" description="The name of the remote site setting you want to create." />
     <apex:attribute name="rssDescription" type="String" required="true" access="global" default="mdapi" description="The description of the remote site setting you want to create." />
     <apex:attribute name="pageOverview" type="String" required="false" default="This tool does lots of fun things with the Metadata API." description="The text to be displayed to the user that will give an overview of the tool using the metadata api." />
-    <apex:attribute name="pageOverviewLinkURL" type="String" required="false" default="http://google.com" description="Some link you want to point the user to."/>
-    <apex:attribute name="pageOverviewLinkText" type="String" required="false" default="Use Google" description="The link text."/>
-    <apex:attribute name="pageSectionTitle" type="String" required="true" access="global" default="Tool using Metadata API" description="This is the section Title for the page." />
-    <apex:attribute name="pageSectionSubTitle" type="String" required="true" access="global" default="Welcome" description="This is the section sub title for the page." />
-    <apex:attribute name="pageImageURL" type="String" required="false" access="global" default="http://andrewfawcett.files.wordpress.com/2013/07/blog_chart1.jpg" description="This is the url of the image to be displayed." />
     
 
     <script>
@@ -59,18 +54,15 @@
         <apex:actionFunction name="displayMetadataResponse" action="{!displayMetadataResponse}" rerender="myForm">
             <apex:param name="metadataResponse" assignTo="{!metadataResponse}" value="{!metadataResponse}"/>
         </apex:actionFunction>
-
-        <apex:sectionHeader title="{!pageSectionTitle}" subtitle="{!pageSectionSubTitle}"/>
+        <p>{!pageOverview}</p>
+        
         <apex:pageMessages />
-        <img src="{!pageImageURL}" width="200" height="200" align="left"/>
         <apex:outputPanel rendered="{!MetadataConnectionWarning}">
             <h1>Important Post Install Step:</h1> 
             <p>In order to utilise the features of this tool, you need to permit the tool access to the Salesforce Metadata API. This can be accomplished by adding a <a target="_new" href="http://na1.salesforce.com/help/doc/en/configuring_remoteproxy.htm">Remote Site Setting</a> with this Salesforce Server URL <b>https://{!Host}</b></p>
             <p> Click the <b>Create Remote Site Setting</b> button to have the tool perform this step for you.</p>
             <input id="createremotesitebtn" type="button" onclick="createRemoteSite();" value="Create Remote Site Setting"/>
         </apex:outputPanel>
-        <p><b>Overview</b>: {!pageOverview}</p>
-        <p><b>Link</b>: <a href="{!pageOverviewLinkURL}" target="_new">{!pageOverviewLinkText}</a></p>
 
         <apex:outputPanel rendered="{!MetadataConnectionWarning}">
             <p style="color:gray">DEBUG USE ONLY: {!metadataApiException}</p>
diff --git a/force-app/main/default/pages/RollbarConfigure.page b/force-app/main/default/pages/RollbarConfigure.page
index 97f761f..1b01f74 100644
--- a/force-app/main/default/pages/RollbarConfigure.page
+++ b/force-app/main/default/pages/RollbarConfigure.page
@@ -1,18 +1,102 @@
-<apex:page controller="RollbarConfigureController">
-    <h1>Congratulations on choosing Rollbar</h1>
-    <p>To finish the installation of Rollbar Apex SDK, please provide your Rollbar project server side access token:</p>
-    <apex:form>
-        <apex:outputLabel value="post_server_item Access Token" for="rollbarAccessToken"/>
-        <apex:inputText value="{!accessToken}" id="rollbarAccessToken" />
-        <apex:commandButton action="{!save}" value="Finish" id="rollbarConfigure"/>
-    </apex:form>
-
-    <c:remotesitehelper rssName="mdapi"
-		rssDescription="SFDC to SFDC metadata api."
-		pageOverview="This is an awesome overview of my tool."
-		pageOverviewLinkURL="http://google.com"
-		pageOverviewLinkText="Google This tool!"
-		pageSectionTitle="My Awesome Package Welcome Page"
-		pageSectionSubTitle="Welcome"
-		/>
+<apex:page controller="RollbarConfigureController" action="{!check}">
+    <style>
+        body, html {
+            background-image: radial-gradient(circle at 50% 66%,#0c84d2,#104c91);
+            height: 100%;
+            color: #fff
+        }
+
+        h3 {
+            font-size: 24px;
+        }
+
+        h4 {
+            font-size: 16px;
+        }
+
+        section, .next-step {
+            margin-top: 2em;
+        }
+
+        .next-step {
+            text-align: center;
+        }
+
+        header {
+            text-align: center;
+        }
+
+        .content {
+            width: 50%;
+            margin: 0 auto;
+        }
+
+        .header {
+            margin: 0 auto;
+            width: 414px;
+            margin-bottom: 2em;
+        }
+
+        .success {
+            color: rgb(176, 211, 116);
+        }
+
+        .error {
+            color:rgb(223, 75, 75);
+        }
+
+        input {
+            padding: 10px !important;
+            font-size: 24px !important;
+            border: none !important;
+        }
+
+        .next-step .btn {
+            background:  rgb(176, 211, 116);
+        }
+
+        .center {
+            text-align:center;
+        }
+    </style>
+
+    <div class="content">
+
+        <div class="header">
+            <div>
+                <img src="https://files.readme.io/22a730d-small-rollbar-logo-white-horiz.png" />
+            </div>
+            <h2>Thank you for choosing us...</h2>
+        </div>
+
+
+    
+        <apex:pageBlock>
+            <h3>Configure Rollbar for Apex</h3>
+            <section>
+                <h4>
+                    1. Enable calls to your Metdata API:
+                </h4>
+                <c:remotesitehelper rssName="mdapi"
+                                    rssDescription="SFDC to SFDC metadata api."
+                                    pageOverview="Rollbar for Apex requires allowing calls to your organization's Metdata API endpoint."
+                />
+            </section>
+            <section>
+                <h4>
+                    2. Set up your Rollbar project post access token:
+                </h4>
+
+                <apex:form>
+                    <p class="center">
+                        <apex:inputText value="{!accessToken}" id="rollbarAccessToken" html-placeholder="Rollbar Access Token" />
+                    </p>
+                    <div class="next-step">
+                        <apex:commandButton action="{!save}" value="Finish" id="rollbarConfigure" />
+                    </div>
+                </apex:form>
+            </section>
+        </apex:pageBlock>
+
+    </div>
 </apex:page>
diff --git a/force-app/main/default/pages/RollbarInstallationCheck.page b/force-app/main/default/pages/RollbarInstallationCheck.page
index ed2de78..e56a1da 100644
--- a/force-app/main/default/pages/RollbarInstallationCheck.page
+++ b/force-app/main/default/pages/RollbarInstallationCheck.page
@@ -1,10 +1,117 @@
 <apex:page controller="RollbarConfigureController" action="{!check}">
-    <h1>Congratulations on choosing Rollbar</h1>
-    <ul>
-        <li>Rollbar API endpoint allowed: {!checks['rollbarApiEndpointAllowed']}</li>
-        <li>Rollbar ping successful: {!checks['rollbarPingSuccessful']} </li>
-        <li>Rollbar Email Service set up: {!checks['rollbarEmailServiceSetUp']} </li>
-        <li>Apex Notifications forwarding set up: {!checks['apexNotificationsForwardingSetUp']} </li>
-        <li>Access Token correct: {!checks['accessTokenCorrect']} </li>
-    </ul>
+    <style>
+        body, html {
+            background-image: radial-gradient(circle at 50% 66%,#0c84d2,#104c91);
+            height: 100%;
+            color: #fff
+        }
+
+        h3 {
+            font-size: 24px;
+        }
+
+        section {
+            margin-top: 2em;
+        }
+
+        header {
+            text-align: center;
+        }
+
+        .content {
+            width: 75%;
+            margin: 0 auto;
+        }
+
+        .header {
+            margin: 0 auto;
+            width: 414px;
+            margin-bottom: 2em;
+        }
+
+        .success {
+            color: rgb(176, 211, 116);
+        }
+
+        .error {
+            color:rgb(223, 75, 75);
+            border: none !important;
+        }
+    </style>
+
+    <div class="content">
+
+        <div class="header">
+            <div>
+                <img src="https://files.readme.io/22a730d-small-rollbar-logo-white-horiz.png" />
+            </div>
+            <h2>Thank you for choosing us...</h2>
+        </div>
+        
+        <apex:pageBlock>
+            <div style="display:{!IF(installed, 'none', 'block')}">
+                <header>
+                    <h3 class="error">Oops! Something went wrong.</h3>
+                </header>
+                <ul>
+                    <li>Rollbar API endpoint allowed: {!checks['rollbarApiEndpointAllowed']}</li>
+                    <li>Rollbar ping successful: {!checks['rollbarPingSuccessful']} </li>
+                    <li>Rollbar Email Service set up: {!checks['rollbarEmailServiceSetUp']} </li>
+                    <li>Apex Notifications forwarding set up: {!checks['apexNotificationsForwardingSetUp']} </li>
+                    <li>Access Token correct: {!checks['accessTokenCorrect']} </li>
+                </ul>
+            </div>
+
+            <div style="display:{!IF(installed, 'block', 'none')}">
+                <header>
+                    <h3 class="success">Success</h3>
+                    <p>
+                        We sent an introductory log message to your Rollbar project. Look for item:
+                    </p>
+                    <p>
+                        <code>Rollbar Apex SDK installed correctly in ...</code>
+                    </p>
+                </header>
+                <section>
+                    <h4>
+                        Here is how to get started using Rollbar in your Apex code:
+                    </h4>
+                    <section>
+                        <h5>Initialization</h5>
+                        <p>
+                            <code>Rollbar.init();</code>
+                        </p>
+                        <p>
+                            This call will initialize the Rollbar notifier with your organization's default access token
+                            and environment.
+                        </p>
+                        <p>
+                            <code>Rollbar.init(String accessToken, String environment);</code>
+                        </p>
+                        <p>
+                            With this overload you can provide a custom access token and custom environment for further
+                            reporting.
+                        </p>
+                    </section>
+                    <section>
+                        <h5>Reporting</h5>
+                        <p>
+                            <code>Rollbar.log(String level, String message);</code>
+                        </p>
+                        <p>
+                            This call will report an arbitrary message at one of the Rollbar reporting levels.
+                        </p>
+                        <p>
+                            <code>Rollbar.log(Exception exception);</code>
+                        </p>
+                        <p> 
+                            You can report an exception object with it's stack trace using the above call.
+                        </p>
+                    </section>
+                </section>
+            </div>
+
+        </apex:pageBlock>
+
+    </div>
 </apex:page>