From f5c76d5f6512c3c2895d3028752be6c7263e2d78 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ciar=C3=A1n=20Ainsworth?= <sporiff@funkwhale.audio>
Date: Sun, 12 Nov 2023 21:50:20 +0000
Subject: [PATCH] feat(front): add login form buttons

---
 front/src/components/auth/LoginForm.vue | 10 +++++++---
 front/src/components/auth/Logout.vue    | 15 ++++++++-------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/front/src/components/auth/LoginForm.vue b/front/src/components/auth/LoginForm.vue
index 41be7710b..ca03b717f 100644
--- a/front/src/components/auth/LoginForm.vue
+++ b/front/src/components/auth/LoginForm.vue
@@ -7,6 +7,8 @@ import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 
+import { FwButton } from '@funkwhale/ui'
+
 import PasswordInput from '~/components/forms/PasswordInput.vue'
 
 interface Props {
@@ -137,11 +139,13 @@ const submit = async () => {
         {{ $t('components.auth.LoginForm.message.redirect', { domain: $store.getters['instance/domain'] }) }}
       </p>
     </template>
-    <button
-      :class="['ui', {'loading': isLoading}, 'right', 'floated', buttonClasses, 'button']"
+    <fw-button
+      color="primary"
+      :is-loading="isLoading"
+      class="right floated"
       type="submit"
     >
       {{ $t('components.auth.LoginForm.button.login') }}
-    </button>
+    </fw-button>
   </form>
 </template>
diff --git a/front/src/components/auth/Logout.vue b/front/src/components/auth/Logout.vue
index 9bb2cdddd..eaf9040dd 100644
--- a/front/src/components/auth/Logout.vue
+++ b/front/src/components/auth/Logout.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
+import { FwButton } from '@funkwhale/ui'
 
 const { t } = useI18n()
 const labels = computed(() => ({
@@ -24,12 +25,12 @@ const labels = computed(() => ({
         <p>
           {{ $t('components.auth.Logout.message.loggedIn', { username: $store.state.auth.username }) }}
         </p>
-        <button
-          class="ui button"
+        <fw-button
+          color="secondary"
           @click="$store.dispatch('auth/logout')"
         >
           {{ $t('components.auth.Logout.button.logout') }}
-        </button>
+        </fw-button>
       </div>
       <div
         v-else
@@ -38,12 +39,12 @@ const labels = computed(() => ({
         <h2>
           {{ $t('components.auth.Logout.header.unauthenticated') }}
         </h2>
-        <router-link
-          to="/login"
-          class="ui button"
+        <fw-button
+          color="primary"
+          @click="$router.push('/login')"
         >
           {{ $t('components.auth.Logout.link.login') }}
-        </router-link>
+        </fw-button>
       </div>
     </section>
   </main>