fix(joyent-cp-frontend): set REACT_APP_GQL_HOSTNAME

docker-compose.yml

@@ -76,7 +76,7 @@ gql-mock-server:
   image: quay.io/yldio/joyent-cp-gql-mock-server:$CIRCLE_BRANCH
   mem_limit: 512m
   labels:
-    - triton.cns.services=gql-mock-server-$CIRCLE_BRANCH,cp-frontend-$CIRCLE_BRANCH
+    - triton.cns.services=gql-mock-server-$CIRCLE_BRANCH
     - com.docker.swarm.affinities=["container!=~*gql-mock-server*"]
   environment:
     - CONSUL_AGENT=1

packages/cp-frontend/Dockerfile

@@ -8,5 +8,9 @@ RUN npm install lerna@^2.0.0-rc.5 \
 WORKDIR /home/node/app/packages/cp-frontend
 COPY packages/cp-frontend/etc/containerpilot.json /etc/
 
+ARG CIRCLE_BRANCH
+
+ENV REACT_APP_GQL_HOSTNAME gql-mock-server-$CIRCLE_BRANCH.svc.f4b20699-b323-4452-9091-977895896da6.eu-ams-1.triton.zone
+
 EXPOSE 3069
 CMD ["/bin/containerpilot", "yarn", "run", "start"]

packages/cp-frontend/src/state/store.js

@@ -4,6 +4,9 @@ import { ApolloClient, createNetworkInterface } from 'react-apollo';
 import state from './state';
 import { ui } from './reducers';
 
+const GQL_HOSTNAME =
+  process.env.REACT_APP_GQL_HOSTNAME || window.location.hostname;
+
 export const client = new ApolloClient({
   dataIdFromObject: o => {
     const id = o.slug
@@ -18,7 +21,7 @@ export const client = new ApolloClient({
     return `${o.__typename}:${id}`;
   },
   networkInterface: createNetworkInterface({
-    uri: `http://${window.location.hostname}:3000/graphql`
+    uri: `http://${GQL_HOSTNAME}:3000/graphql`
   })
 });
 

scripts/deploy

@@ -154,12 +154,23 @@ const deploy = async () => {
   });
 
   // up project
-  return execa('docker-compose', ['up', '-d', '--build', '--force-recreate'], {
-    stdio: 'inherit',
-    env: Object.assign({}, env, {
-      COMPOSE_PROJECT_NAME
-    })
-  });
+  return execa(
+    'docker-compose',
+    [
+      'up',
+      '-d',
+      '--build',
+      '--force-recreate',
+      '--build-arg',
+      `CIRCLE_BRANCH=${process.env.CIRCLE_BRANCH}`
+    ],
+    {
+      stdio: 'inherit',
+      env: Object.assign({}, env, {
+        COMPOSE_PROJECT_NAME
+      })
+    }
+  );
 };
 
 const run = async () => {