From eb8a4a11ec6057c5961e96c4df3917c002377055 Mon Sep 17 00:00:00 2001
From: Oliver Davies <oliver@oliverdavies.uk>
Date: Thu, 27 Dec 2018 09:48:24 +0000
Subject: [PATCH] Add links to environment pages

---
 src/components/Environment/EnvironmentCard.vue | 10 +++++++---
 src/views/Environments.vue                     |  2 +-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/components/Environment/EnvironmentCard.vue b/src/components/Environment/EnvironmentCard.vue
index 43cf97d..5f8a7bb 100644
--- a/src/components/Environment/EnvironmentCard.vue
+++ b/src/components/Environment/EnvironmentCard.vue
@@ -5,12 +5,15 @@
         <div class="border border-grey rounded overflow-hidden">
            <div class="bg-white">
             <div class="border-t-4 border-teal p-3">
-              <a href="#0" class="no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">
+              <router-link :to="{ name: 'environment', params: { environmentName: key, id: id }}" class="flex items-baseline no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">
                 <h2 class="mb-1">{{ environment.name }}</h2>
-              </a>
+                <svg class="w-4 h-4 fill-current text-inherit ml-2" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12.95 10.707l.707-.707L8 4.343 6.586 5.757 10.828 10l-4.242 4.243L8 15.657l4.95-4.95z" fill-rule="evenodd"/></svg>
+              </router-link>
 
               <div class="text-grey-darker mb-2">
-                <a href="#0" class="no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">{{ environment.url }}</a>
+                <a href="#0" class="no-underline hover:underline focus:underline text-grey-darkest hover:text-blue-dark focus:text-blue-dark focus:outline-none">
+                  {{ environment.url }}
+                </a>
               </div>
 
               <div class="text-grey-darker">{{ environment.label }}</div>
@@ -49,6 +52,7 @@
 export default {
   props: {
     environments: Object,
+    id: String,
   },
 }
 </script>
diff --git a/src/views/Environments.vue b/src/views/Environments.vue
index 5e4218b..584dbb1 100644
--- a/src/views/Environments.vue
+++ b/src/views/Environments.vue
@@ -58,7 +58,7 @@
           </div>
 
           <quick-help :hidden="help.hidden"></quick-help>
-          <environment-card :environments="application.environments"></environment-card>
+          <environment-card :environments="application.environments" :id="id"></environment-card>
           <task-log :tasks="application.tasks"></task-log>
         </div>