Skip to content

Commit 2496449

Browse files
MrSunshyneMrSunshyne
committed
enable github button
1 parent d65bdd2 commit 2496449

File tree

2 files changed

+33
-49
lines changed

2 files changed

+33
-49
lines changed

‎packages/frontendmu-nuxt/auth-utils/useAuth.ts

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -220,9 +220,19 @@ export default function useAuth(client: DirectusClient<any> & AuthenticationClie
220220
return false
221221
})
222222

223-
function oAuthLogin() {
224-
const currentPage = new URL(window.location.origin)
225-
return `${DIRECTUS_URL()}/auth/login/google?redirect=${currentPage}redirect`
223+
function oAuthLogin(provider: string) {
224+
if (provider === 'google') {
225+
const currentPage = new URL(window.location.origin)
226+
return `${DIRECTUS_URL()}/auth/login/google?redirect=${currentPage}redirect`
227+
}
228+
else if (provider === 'github') {
229+
const currentPage = new URL(window.location.origin)
230+
return `${DIRECTUS_URL()}/auth/login/github?redirect=${currentPage}redirect`
231+
}
232+
233+
console.log('Provider not found')
234+
235+
return false
226236
}
227237

228238
async function updateUserProfile({ profile_updates }: { profile_updates: DirectusAstroUser }) {

‎packages/frontendmu-nuxt/components/auth/LoginForm.vue

Lines changed: 20 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,8 @@ const developmentEnvironment = process.env.NODE_ENV === 'development'
2828
</h2>
2929
</div>
3030
<div class="mt-10 sm:mx-auto sm:w-full sm:max-w-[480px] flex justify-center">
31-
<div class="bg-verse-200/10 overflow-hidden dark:bg-verse-500/20 backdrop-blur-sm px-6 py-12 shadow-2xl rounded-lg sm:px-12 w-11/12">
31+
<div
32+
class="bg-verse-200/10 overflow-hidden dark:bg-verse-500/20 backdrop-blur-sm px-6 py-12 shadow-2xl rounded-lg sm:px-12 w-11/12">
3233
<div v-if="isLoggedIn">
3334
<div class="text-center flex flex-col gap-8 text-verse-900 dark:text-verse-100 w-full">
3435
<span>
@@ -52,41 +53,24 @@ const developmentEnvironment = process.env.NODE_ENV === 'development'
5253
<div v-else>
5354
<form v-if="developmentEnvironment" class="space-y-6" @submit.prevent="login()">
5455
<div>
55-
<label
56-
for="email"
57-
class="block text-sm font-medium leading-6 text-verse-900 dark:text-verse-100"
58-
>
56+
<label for="email" class="block text-sm font-medium leading-6 text-verse-900 dark:text-verse-100">
5957
Email address
6058
</label>
6159
<div class="mt-2">
62-
<input
63-
id="email"
64-
v-model="email"
65-
name="email"
66-
type="email"
67-
autocomplete="email"
60+
<input id="email" v-model="email" name="email" type="email" autocomplete="email"
6861
class="block w-full rounded-md border-0 p-1.5 text-verse-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-verse-600 sm:text-sm sm:leading-6"
69-
required
70-
>
62+
required>
7163
</div>
7264
</div>
7365

7466
<div>
75-
<label
76-
for="password"
77-
class="block text-sm font-medium leading-6 text-verse-900 dark:text-verse-100"
78-
>
67+
<label for="password" class="block text-sm font-medium leading-6 text-verse-900 dark:text-verse-100">
7968
Password
8069
</label>
8170
<div class="mt-2">
82-
<input
83-
id="password"
84-
v-model="password"
85-
name="password"
86-
type="password"
87-
autocomplete="current-password" required
88-
class="block w-full rounded-md border-0 p-1.5 text-verse-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-verse-600 sm:text-sm sm:leading-6"
89-
>
71+
<input id="password" v-model="password" name="password" type="password" autocomplete="current-password"
72+
required
73+
class="block w-full rounded-md border-0 p-1.5 text-verse-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-verse-600 sm:text-sm sm:leading-6">
9074
</div>
9175
</div>
9276

@@ -103,10 +87,8 @@ const developmentEnvironment = process.env.NODE_ENV === 'development'
10387
</div> -->
10488

10589
<div>
106-
<button
107-
type="submit"
108-
class="flex w-full justify-center rounded-md bg-verse-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-verse-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-verse-600"
109-
>
90+
<button type="submit"
91+
class="flex w-full justify-center rounded-md bg-verse-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-verse-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-verse-600">
11092
Sign in
11193
</button>
11294
</div>
@@ -124,36 +106,28 @@ const developmentEnvironment = process.env.NODE_ENV === 'development'
124106
</div>
125107

126108
<div class="mt-10 grid sm:grid-cols-2 gap-4">
127-
<a
128-
:href="oAuthLogin()"
129-
class="flex w-full items-center justify-center gap-3 rounded-md bg-[#000000] hover:bg-black/50 transition-all duration-300 px-3 py-1.5 text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#1D9BF0]"
130-
>
109+
<a :href="oAuthLogin('google')"
110+
class="flex w-full items-center justify-center gap-3 rounded-md bg-[#000000] hover:bg-black/50 transition-all duration-300 px-3 py-1.5 text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#1D9BF0]">
131111
<Icon name="logos:google-icon" class="h-5 w-5" />
132112
<span class="text-sm font-semibold leading-6">Google</span>
133113
</a>
134114

135-
<a
136-
href="#"
137-
class="opacity-60 cursor-not-allowed flex w-full items-center justify-center gap-3 rounded-md bg-[#24292F] px-3 py-1.5 text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#24292F]"
138-
disabled
139-
>
115+
<a href="#"
116+
class="flex w-full items-center justify-center gap-3 rounded-md bg-[#000000] hover:bg-black/50 px-3 py-1.5 text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[#24292F]"
117+
disabled>
140118
<svg class="h-5 w-5" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20">
141-
<path
142-
fill-rule="evenodd"
119+
<path fill-rule="evenodd"
143120
d="M10 0C4.477 0 0 4.484 0 10.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0110 4.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.203 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.942.359.31.678.921.678 1.856 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0020 10.017C20 4.484 15.522 0 10 0z"
144-
clip-rule="evenodd"
145-
/>
121+
clip-rule="evenodd" />
146122
</svg>
147123
<span class="text-sm font-semibold leading-6">GitHub</span>
148124
</a>
149125
</div>
150126
</div>
151127
</div>
152128

153-
<div
154-
class="absolute bottom-0 left-0 bg-zinc-500/20 dark:bg-verse-500/20 backdrop-blur-2xl right-0 z-10 h-0"
155-
:style="{ height: countDownPercentage }"
156-
/>
129+
<div class="absolute bottom-0 left-0 bg-zinc-500/20 dark:bg-verse-500/20 backdrop-blur-2xl right-0 z-10 h-0"
130+
:style="{ height: countDownPercentage }" />
157131
</div>
158132
</div>
159133
</template>

0 commit comments

Comments
 (0)