From ebab360f224183ba7c67fda132f60b637da91389 Mon Sep 17 00:00:00 2001
From: Kamil Klecha <urlikodd@gmail.com>
Date: Wed, 20 Oct 2021 00:54:19 +0200
Subject: [PATCH] CICD-test

---
 .drone.yml                 | 10 ++++++++++
 Dockerfile                 | 17 +++++++++++++++++
 src/components/City.vue    | 25 ++++++++++++++++++-------
 src/components/NewCity.vue |  3 ++-
 src/config.json            | 11 +++++++++++
 src/main.ts                | 16 +++++++++-------
 start-nginx.sh             |  9 +++++++++
 7 files changed, 76 insertions(+), 15 deletions(-)
 create mode 100644 .drone.yml
 create mode 100644 Dockerfile
 create mode 100644 src/config.json
 create mode 100644 start-nginx.sh

diff --git a/.drone.yml b/.drone.yml
new file mode 100644
index 0000000..0b2b7df
--- /dev/null
+++ b/.drone.yml
@@ -0,0 +1,10 @@
+kind: pipeline
+type: docker
+steps:
+- name: dockerize
+  image: plugins/docker
+  settings:
+    repo: docker-registry.kamilklecha.dev/vetro/weather-demo
+    dockerfile: ./Dockerfile
+    tags:
+      - cicd-test
\ No newline at end of file
diff --git a/Dockerfile b/Dockerfile
new file mode 100644
index 0000000..c080581
--- /dev/null
+++ b/Dockerfile
@@ -0,0 +1,17 @@
+FROM node:16
+ENV JQ_VERSION=1.6
+RUN wget --no-check-certificate https://github.com/stedolan/jq/releases/download/jq-${JQ_VERSION}/jq-linux64 -O /tmp/jq-linux64
+RUN cp /tmp/jq-linux64 /usr/bin/jq
+RUN chmod +x /usr/bin/jq
+WORKDIR /app
+COPY . .
+RUN jq 'to_entries | map_values({ (.key) : ("$" + .key) }) | reduce .[] as $item ({}; . + $item)' ./src/config.json > ./src/config.tmp.json && mv ./src/config.tmp.json ./src/config.json
+RUN npm install && npm run build
+
+FROM nginx:stable
+ENV JSFOLDER=/usr/share/nginx/html/js/*.js
+COPY ./start-nginx.sh /usr/bin/start-nginx.sh
+RUN chmod +x /usr/bin/start-nginx.sh
+WORKDIR /usr/share/nginx/html
+COPY --from=0 /app/dist .
+ENTRYPOINT [ "start-nginx.sh" ]
\ No newline at end of file
diff --git a/src/components/City.vue b/src/components/City.vue
index bb4a1f7..2168442 100644
--- a/src/components/City.vue
+++ b/src/components/City.vue
@@ -56,7 +56,9 @@
       <v-card-actions>
         <v-row>
           <v-col cols="6">
-            <v-btn block class="primary" @click="details = true">Szczegóły</v-btn>
+            <v-btn block class="primary" @click="details = true"
+              >Szczegóły</v-btn
+            >
           </v-col>
           <v-col cols="6">
             <v-btn block class="error" @click="deleteCity()">Usuń</v-btn>
@@ -65,20 +67,26 @@
       </v-card-actions>
     </v-card>
     <v-skeleton-loader type="card" v-else></v-skeleton-loader>
-    <Details v-model="details" :city="city" :wdata="data" v-if="city && data"></Details>
+    <Details
+      v-model="details"
+      :city="city"
+      :wdata="data"
+      v-if="city && data"
+    ></Details>
   </div>
 </template>
 
 <script lang="ts">
 import { Component, Prop, Vue } from "vue-property-decorator";
-import Details from '@/components/Details.vue';
+import Details from "@/components/Details.vue";
 import axios from "axios";
 const moment = require("moment");
+const Config = require("@/config.json");
 
 @Component({
   components: {
     Details,
-  }
+  },
 })
 export default class City extends Vue {
   @Prop({ required: true }) private readonly city!: any;
@@ -96,14 +104,17 @@ export default class City extends Vue {
           lon: this.city.coord.lon,
           units: "metric",
           lang: "pl",
-          appid: process.env.VUE_APP_OWM_API_KEY,
+          appid: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_OWM_API_KEY : Config.OWM_API_KEY,
         },
       })
       .then((res) => {
         this.$data.data = res.data;
       })
       .catch((e) => {
-        console.error(e);
+        this.$store.dispatch(
+          "errorMessage",
+          "Błąd " + e.status.code + " przy pobieraniu danych!"
+        );
       });
   }
 
@@ -112,7 +123,7 @@ export default class City extends Vue {
   }
 
   private deleteCity() {
-    this.$emit('delete');
+    this.$emit("delete");
   }
 
   private data() {
diff --git a/src/components/NewCity.vue b/src/components/NewCity.vue
index 0ea701d..475e8c5 100644
--- a/src/components/NewCity.vue
+++ b/src/components/NewCity.vue
@@ -71,6 +71,7 @@
 <script lang="ts">
 import { Component, Watch, Vue } from "vue-property-decorator";
 import axios from "axios";
+const Config = require("@/config.json");
 
 @Component
 export default class NewCity extends Vue {
@@ -90,7 +91,7 @@ export default class NewCity extends Vue {
   private queryCity() {
     if (this.$data.search.length > 0) {
       axios
-        .get(process.env.VUE_APP_CITY_RESOLVER, {
+        .get(process.env.NODE_ENV === 'development' ? process.env.VUE_APP_CITY_RESOLVER : Config.CITY_RESOLVER, {
           params: {
             query: this.$data.search,
           },
diff --git a/src/config.json b/src/config.json
new file mode 100644
index 0000000..ab7ef01
--- /dev/null
+++ b/src/config.json
@@ -0,0 +1,11 @@
+{
+  "CITY_RESOLVER": "$CITY_RESOLVER",
+  "OWM_API_KEY": "$OWM_API_KEY",
+  "FIREBASE_apiKey": "$FIREBASE_apiKey",
+  "FIREBASE_authDomain": "$FIREBASE_authDomain",
+  "FIREBASE_projectId": "$FIREBASE_projectId",
+  "FIREBASE_storageBucket": "$FIREBASE_storageBucket",
+  "FIREBASE_messagingSenderId": "$FIREBASE_messagingSenderId",
+  "FIREBASE_appId": "$FIREBASE_appId",
+  "FIREBASE_measurementId": "$FIREBASE_measurementId"
+}
diff --git a/src/main.ts b/src/main.ts
index 0e80e33..dddbe62 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -6,18 +6,20 @@ import VueApexCharts from 'vue-apexcharts'
 
 import { initializeApp } from "firebase/app";
 
+const Config = require("@/config.json");
+
 Vue.config.productionTip = false;
 
 Vue.use(VueApexCharts)
 
 const firebaseConfig = {
-  apiKey: process.env.VUE_APP_FIREBASE_apiKey,
-  authDomain: process.env.VUE_APP_FIREBASE_authDomain,
-  projectId: process.env.VUE_APP_FIREBASE_projectId,
-  storageBucket: process.env.VUE_APP_FIREBASE_storageBucket,
-  messagingSenderId: process.env.VUE_APP_FIREBASE_messagingSenderId,
-  appId: process.env.VUE_APP_FIREBASE_appId,
-  measurementId: process.env.VUE_APP_FIREBASE_measurementId,
+  apiKey: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_FIREBASE_apiKey : Config.FIREBASE_apiKey,
+  authDomain: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_FIREBASE_authDomain : Config.FIREBASE_authDomain,
+  projectId: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_FIREBASE_projectId : Config.FIREBASE_projectId,
+  storageBucket: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_FIREBASE_storageBucket : Config.FIREBASE_storageBucket,
+  messagingSenderId: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_FIREBASE_messagingSenderId : Config.FIREBASE_messagingSenderId,
+  appId: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_FIREBASE_appId : Config.FIREBASE_appId,
+  measurementId: process.env.NODE_ENV === 'development' ? process.env.VUE_APP_FIREBASE_measurementId : Config.FIREBASE_measurementId,
 };
 
 const app = initializeApp(firebaseConfig);
diff --git a/start-nginx.sh b/start-nginx.sh
new file mode 100644
index 0000000..26ab0c5
--- /dev/null
+++ b/start-nginx.sh
@@ -0,0 +1,9 @@
+#!/usr/bin/env sh
+cp /usr/share/nginx/html/js/*.js /tmp
+
+export EXISTING_VARS=$(printenv | awk -F= '{print $1}' | sed 's/^/\$/g' | paste -sd,);
+for file in /tmp/*.js;
+do
+cat $file | envsubst $EXISTING_VARS | tee /usr/share/nginx/html/js/$(basename $file)
+done
+nginx -g 'daemon off;'
\ No newline at end of file