Fix options strip issues

mobile/src/API.js

@@ -34,21 +34,19 @@ class APIError extends Error {
 
 @autobind
 class API extends EventEmitter {
-  static apiPath = "/api"
+  static urls = {
+    normal: "https://dar.kss.us.com/api",
+    test: "https://dar-test.kss.us.com/api",
+    local: `http://${local.ipAddr}:3001`,
+  }
 
   constructor() {
     super()
     this.user = { pending: true }
-
-    const baseURLs = {
-      normal: "https://dar.kss.us.com",
-      test: "https://dar-test.kss.us.com",
-      development: `http://${local.ipAddr}:3001`,
-    }
-    this.baseURL = null
+    this._apiURL = null
 
     const checkForToken = () => {
-      console.log(`${this.backendName} - ${this.baseURL}`)
+      console.log(`${this._backend} - ${this.apiURL}`)
       AsyncStorage.getItem(authTokenKeyName)
         .then((token) => {
           if (!token) {
@@ -75,28 +73,28 @@ class API extends EventEmitter {
     }
 
     AsyncStorage.getItem(backendKeyName)
-      .then((backendName) => {
-        this.backendName = backendName
-        this.baseURL = baseURLs[backendName]
+      .then((backend) => {
+        this._backend = backend
+        this.apiURL = API.urls[backend]
 
-        if (!this.baseURL) {
+        if (!this.apiURL) {
           return Promise.reject()
         }
-        console.log("setting backend")
+        console.log(`setting backend ${this._backend} - ${this.apiURL}`)
         checkForToken()
       })
       .catch(() => {
-        this.backendName = "normal"
-        this.baseURL = baseURLS[this.backendName]
-        AsyncStorage.setItem(backendKeyName, this.backendName)
+        this._backend = "normal"
+        this.apiURL = baseURLS[this._backend]
+        AsyncStorage.setItem(backendKeyName, this._backend)
         console.log("setting default backend")
         checkForToken()
       })
   }
 
   connectSocket() {
-    this.socket = io(this.baseURL, {
-      path: API.apiPath + "/socketio",
+    this.socket = io(this._baseURL, {
+      path: this.apiPath + "/socketio",
       query: {
         auth_token: this.token,
       },
@@ -130,25 +128,67 @@ class API extends EventEmitter {
     return this.user
   }
 
-  get backend() {
-    return this.backendName
+  get apiURL() {
+    return this._apiURL
   }
 
-  set backend(value) {
-    if (this.backendName !== value) {
-      this.backendName = value
-      AsyncStorage.setItem(backendKeyName, this.backendName).then(
-        this.logout,
-        this.logout
-      )
+  set apiURL(url) {
+    if (url) {
+      const parts = url.split("/")
+
+      if (parts.length < 2) {
+        throw new Error("Invalid API URL")
+      }
+
+      this._apiURL = url
+      this._baseURL = parts[0] + "//" + parts[1]
+      this._secure = parts[0] === "https:"
+
+      if (parts.length === 3) {
+        this._apiPath = "/" + parts[2]
+      } else {
+        this._apiPath = ""
+      }
+    }
+  }
+
+  get baseURL() {
+    return this._baseURL
+  }
+
+  get apiPath() {
+    return this._apiPath
+  }
+
+  get secure() {
+    return this._secure
+  }
+
+  get backend() {
+    return this._backend
+  }
+
+  set backend(backend) {
+    if (this._backend !== backend) {
+      const newBaseURL = API.urls[backend]
+
+      if (newBaseURL) {
+        this.apiURL = newBaseURL
+        this._backend = backend
+        console.log(`setting backend ${this._backend} - ${this.apiURL}`)
+        AsyncStorage.setItem(backendKeyName, this._backend).then(
+          this.logout,
+          this.logout
+        )
+      }
     }
   }
 
   makeImageUrl(id, size) {
     if (id) {
-      return API.apiPath + "/assets/" + id + "?access_token=" + this.token
+      return this.apiPath + "/assets/" + id + "?access_token=" + this.token
     } else if (size && size.width && size.height) {
-      return `${API.apiPath}/placeholders/${size.width}x${
+      return `${this.apiPath}/placeholders/${size.width}x${
         size.height
       }?access_token=${this.token}`
     } else {
@@ -158,7 +198,7 @@ class API extends EventEmitter {
 
   makeAssetUrl(id) {
     return id
-      ? API.apiPath + "/assets/" + id + "?access_token=" + this.token
+      ? this.apiPath + "/assets/" + id + "?access_token=" + this.token
       : null
   }
 
@@ -196,15 +236,11 @@ class API extends EventEmitter {
       }
       fetchOptions.headers = headers
 
-      if (!this.baseURL) {
-        tconsole.error("no baseURL!")
+      if (!this.apiURL) {
         return reject(new Error("API layer not ready"))
       }
 
-      console.log(
-        `${fetchOptions.method} - ${this.baseURL + API.apiPath + path}`
-      )
-      fetch(this.baseURL + API.apiPath + path, fetchOptions)
+      fetch(this.apiURL + path, fetchOptions)
         .then((res) => {
           return Promise.all([
             Promise.resolve(res),

mobile/src/Auth/Login.js

@@ -110,8 +110,9 @@ export class Login extends React.Component {
   }
 
   @autobind
-  handleApiDismiss() {
+  handleApiDismiss(backendName) {
     this.setState({ apiModal: null })
+    api.backend = backendName
   }
 
   @autobind

mobile/src/Modal/ApiModal.js

@@ -24,7 +24,7 @@ export class ApiModal extends Component {
     const { onDismiss } = this.props
 
     if (onDismiss) {
-      onDismiss()
+      onDismiss(this.state.value)
     }
   }
 

mobile/src/ui/OptionStrip.js

@@ -61,8 +61,13 @@ export class OptionStrip extends Component {
             key={index}
             underlayColor="#3BB0FD"
             style={[
-              { flexGrow: 1, flexBasis: 0, height: 40 },
-              option === selectedOption && { backgroundColor: "#3BB0FD" },
+              {
+                flexGrow: 1,
+                flexBasis: 0,
+                height: 40,
+                backgroundColor:
+                  option === selectedOption ? "#3BB0FD" : "#EEEEEE",
+              },
               index === 0 && {
                 borderTopLeftRadius: 6,
                 borderBottomLeftRadius: 6,
@@ -78,9 +83,10 @@ export class OptionStrip extends Component {
                 {
                   flex: 1,
                   justifyContent: "center",
-                  borderTopWidth: 1,
-                  borderBottomWidth: 1,
-                  borderLeftWidth: 1,
+                  // TODO: Setting specific border widths broken in RN 0.49.  Enable in RN 0.55 and above?
+                  // borderTopWidth: 1,
+                  // borderBottomWidth: 1,
+                  // borderLeftWidth: 1,
                   borderColor: "black",
                 },
                 index === 0 && {

server/src/api/routes/AuthRoutes.js

@@ -101,7 +101,7 @@ export class AuthRoutes {
     if (isValid) {
       user.loginToken = loginToken.pack(user._id.toString(), user.email)
     } else {
-      user.loginToken = null // A bad login removes existing token for this user...
+      user.loginToken = undefined // A bad login removes existing token for this user...
     }
 
     const savedUser = await user.save()
@@ -120,7 +120,7 @@ export class AuthRoutes {
     const user = await User.findById({ _id: req.user._id })
 
     if (user) {
-      user.loginToken = null
+      user.loginToken = undefined
       await user.save()
     }