wip

Jigsaw-Code · Oct 13, 2023 · 793c640 · 793c640
1 parent 421758b
commit 793c640
Show file tree

Hide file tree

Showing 5 changed files with 56 additions and 13 deletions.
diff --git a/x/examples/outline-connectivity-app/app_mobile/app.ts b/x/examples/outline-connectivity-app/app_mobile/app.ts
@@ -46,7 +46,9 @@ SharedFrontend.registerAllElements();
 @customElement("app-main")
 export class AppMain extends LitElement {
   render() {
-    return html`<connectivity-test-page .onSubmit=${
+    return html`<connectivity-test-page 
+    .resolvePlatform=${() => requestBackend<void, SharedFrontend.PlatformMetadata>("PlatformMetadata", void 0)}
+    .onSubmit=${
       (parameters: ConnectivityTestRequest) =>
         requestBackend<ConnectivityTestRequest, ConnectivityTestResponse>(
           "ConnectivityTest", parameters 

diff --git a/x/examples/outline-connectivity-app/shared_backend/handle_request.go b/x/examples/outline-connectivity-app/shared_backend/handle_request.go
@@ -55,7 +55,7 @@ func HandleRequest(rawRequest []byte) []byte {
 
 		result, resultError = ConnectivityTest(parameters)
 	} else if request.ResourceName == "Platform" {
-		result = Platform(parameters)
+		result = Platform()
 	} else {
 		response.Error = "HandleRequest: method name not found"
 	}

diff --git a/x/examples/outline-connectivity-app/shared_backend/main.go b/x/examples/outline-connectivity-app/shared_backend/main.go
@@ -153,7 +153,7 @@ type PlatformMetadata struct {
 }
 
 func Platform() PlatformMetadata {
-	return []PlatformMetadata{ OS: runtime.GOOS }
+	return PlatformMetadata{OS: runtime.GOOS}
 }
 
 func makeErrorRecord(err error) *ConnectivityTestError {

diff --git a/x/examples/outline-connectivity-app/shared_frontend/pages/connectivity_test/index.ts b/x/examples/outline-connectivity-app/shared_frontend/pages/connectivity_test/index.ts
@@ -13,10 +13,10 @@
 // limitations under the License.
 
 import { configureLocalization, msg, localized } from "@lit/localize";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, nothing } from "lit";
 import { property } from "lit/decorators.js";
 import { sourceLocale, targetLocales } from "./generated/messages";
-import type { ConnectivityTestRequest, ConnectivityTestResponse, ConnectivityTestResult } from "./types";
+import { ConnectivityTestRequest, ConnectivityTestResponse, ConnectivityTestResult, OperatingSystem, PlatformMetadata } from "./types";
 
 export * from "./types";
 
@@ -31,14 +31,20 @@ const Localization = configureLocalization({
 // @ts-ignore-next-line
 @localized()
 export class ConnectivityTestPage extends LitElement {
+  @property({ type: Function })
+  resolvePlatform?: () => Promise<PlatformMetadata>;
+
   @property({ type: Function })
   onSubmit?: (request: ConnectivityTestRequest) => Promise<ConnectivityTestResponse>;
 
+  @property({ attribute: false })
+  platform?: PlatformMetadata;
+
   @property({ attribute: false })
   isSubmitting = false;
 
   @property({ attribute: false })
-  testResponse: ConnectivityTestResponse = null;
+  testResponse?: ConnectivityTestResponse;
 
   get locale() {
     return Localization.getLocale();
@@ -84,6 +90,14 @@ export class ConnectivityTestPage extends LitElement {
     };
   }
 
+  protected async performUpdate() {
+    if (!this.platform && this.resolvePlatform) {
+      this.platform = await this.resolvePlatform();
+    }
+
+    super.performUpdate();
+  }
+
   async testConnectivity(event: SubmitEvent) {
     event.preventDefault();
 
@@ -572,17 +586,13 @@ export class ConnectivityTestPage extends LitElement {
       .field-header-info {
         display: none;
       }
-
-      /* if ios */
-      .header {
-        padding-top: 3.7rem;
-      }
     }
   `;
 
   render() {
     // TODO: move language definitions to a centralized place
     return html`<main dir="${this.locale === "fa-IR" ? "rtl" : "ltr"}">
+      ${this.renderPlatformStyles()}
       <header class="header">
         <h1 class="header-text">${msg("Outline Connectivity Test")}</h1>
       </header>
@@ -742,9 +752,28 @@ export class ConnectivityTestPage extends LitElement {
     </main>`;
   }
 
+  renderPlatformStyles() {
+    if (!this.platform) {
+      return nothing;
+    }
+
+    // TODO: changes how switches look on android
+    switch (this.platform.operatingSystem) {
+      case OperatingSystem.IOS:
+        return html`
+        <style>
+          .header {
+            padding-top: 3.7rem;
+          }
+        </style>`;
+      default:
+        return nothing;
+    }
+  }
+
   renderResults() {
     if (!this.testResponse) {
-      return;
+      return nothing;
     }
 
     return html`<dialog open class="results">

diff --git a/x/examples/outline-connectivity-app/shared_frontend/pages/connectivity_test/types.ts b/x/examples/outline-connectivity-app/shared_frontend/pages/connectivity_test/types.ts
@@ -34,4 +34,16 @@ export interface ConnectivityTestResult {
   };
 }
 
-export type ConnectivityTestResponse =  ConnectivityTestResult[] | Error | null;
+export type ConnectivityTestResponse =  ConnectivityTestResult[] | Error | null;
+
+export enum OperatingSystem {
+  ANDROID = "android",
+  IOS = "ios",
+  LINUX = "linux",
+  MACOS = "darwin",
+  WINDOWS = "windows"
+}
+
+export interface PlatformMetadata {
+  operatingSystem: OperatingSystem;
+}