Adding signed-in attribute to mgt-mock-provider (#189)

Author: shweaver-MSFT

index.html

@@ -29,7 +29,7 @@
       depends-on="mgt-teams-provider"
     ></mgt-msal-provider>
 
-    <!-- <mgt-mock-provider></mgt-mock-provider> -->
+    <!-- <mgt-mock-provider signed-in></mgt-mock-provider> -->
 
     <mgt-login></mgt-login>
     <mgt-person person-query="me" show-name show-email person-card="hover"></mgt-person>

src/mock/mgt-mock-provider.ts

@@ -5,7 +5,7 @@
  * -------------------------------------------------------------------------------------------
  */
 
-import { customElement, LitElement } from 'lit-element';
+import { customElement, LitElement, property } from 'lit-element';
 import { Providers } from '../Providers';
 import { MockProvider } from './MockProvider';
 /**
@@ -17,8 +17,25 @@ import { MockProvider } from './MockProvider';
  */
 @customElement('mgt-mock-provider')
 export class MgtMockProvider extends LitElement {
+  /**
+   * A property to allow the developer to start the sample logged out if they desired.
+   *
+   * @memberof MgtMockProvider
+   */
+  @property({
+    attribute: 'signed-in',
+    type: Boolean
+  })
+  public signedIn;
+
   constructor() {
     super();
-    Providers.globalProvider = new MockProvider(true);
+
+    // Access the 'signed-in' attribute directly.
+    // LitElement doesn't parse attributes early enough for us enact on them from the constructor.
+    const signedInVal = (<any>this).getAttribute('signed-in');
+    this.signedIn = signedInVal !== 'false' && signedInVal !== null;
+
+    Providers.globalProvider = new MockProvider(this.signedIn);
   }
 }