Skip to content

Commit 5de4a97

Browse files
thamudithamudi
authored
refactor: add prefix nuxt_ to community_api_url env var (#197)
1 parent 4b8e5f2 commit 5de4a97

File tree

26 files changed

+107
-98
lines changed

26 files changed

+107
-98
lines changed

‎.drone.yml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,9 @@ steps:
1717
repo: josaorg/community-web
1818
build_args:
1919
[
20-
COMMUNITY_API_URL=https://community.api.josa.dev/v2,
20+
NUXT_COMMUNITY_API_URL=https://community.api.josa.dev/v2,
2121
TARGET_ENV=development,
22-
SESSION_COOKIE_NAME=connect.sid
22+
SESSION_COOKIE_NAME=connect.sid,
2323
]
2424
build_args_from_env:
2525
[

‎.env.sample‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
# endpoint for API
2-
COMMUNITY_API_URL=
2+
NUXT_COMMUNITY_API_URL=
33
TARGET_ENV=
44
DRONE_COMMIT_SHA=
55
DRONE_BUILD_NUMBER=

‎Dockerfile‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
# set global args
2-
ARG COMMUNITY_API_URL HOST=0.0.0.0 PORT=3000 USER=node TARGET_ENV DRONE_COMMIT_SHA=${DRONE_COMMIT_SHA} DRONE_BUILD_NUMBER=${DRONE_BUILD_NUMBER} DRONE_BUILD_LINK=${DRONE_BUILD_LINK} DRONE_COMMIT_LINK=${DRONE_COMMIT_LINK} DRONE_REPO_LINK=${DRONE_REPO_LINK} DRONE_BUILD_FINISHED=${DRONE_BUILD_FINISHED} DEBUG='false' SESSION_COOKIE_NAME='connect.sid'
2+
ARG NUXT_COMMUNITY_API_URL HOST=0.0.0.0 PORT=3000 USER=node TARGET_ENV DRONE_COMMIT_SHA=${DRONE_COMMIT_SHA} DRONE_BUILD_NUMBER=${DRONE_BUILD_NUMBER} DRONE_BUILD_LINK=${DRONE_BUILD_LINK} DRONE_COMMIT_LINK=${DRONE_COMMIT_LINK} DRONE_REPO_LINK=${DRONE_REPO_LINK} DRONE_BUILD_FINISHED=${DRONE_BUILD_FINISHED} DEBUG='false' SESSION_COOKIE_NAME='connect.sid'
33

44
###########
55
# BUILDER #
66
###########
77
FROM node:18.14.0 AS builder
88

99
# pass the global args
10-
ARG COMMUNITY_API_URL
10+
ARG NUXT_COMMUNITY_API_URL
1111
ARG HOST
1212
ARG PORT
1313
ARG TARGET_ENV
@@ -26,7 +26,7 @@ COPY . .
2626
RUN npm install
2727

2828
# inject build args as enviroment variables
29-
ENV COMMUNITY_API_URL=${COMMUNITY_API_URL} HOST=${HOST} PORT=${PORT} TARGET_ENV=${TARGET_ENV} DRONE_COMMIT_SHA=$DRONE_COMMIT_SHA DRONE_BUILD_NUMBER=${DRONE_BUILD_NUMBER} DRONE_BUILD_LINK=${DRONE_BUILD_LINK} DRONE_COMMIT_LINK=${DRONE_COMMIT_LINK} DRONE_REPO_LINK=${DRONE_REPO_LINK} DRONE_BUILD_FINISHED=${DRONE_BUILD_FINISHED} DEBUG=${DEBUG} SESSION_COOKIE_NAME=${SESSION_COOKIE_NAME}
29+
ENV NUXT_COMMUNITY_API_URL=${NUXT_COMMUNITY_API_URL} HOST=${HOST} PORT=${PORT} TARGET_ENV=${TARGET_ENV} DRONE_COMMIT_SHA=$DRONE_COMMIT_SHA DRONE_BUILD_NUMBER=${DRONE_BUILD_NUMBER} DRONE_BUILD_LINK=${DRONE_BUILD_LINK} DRONE_COMMIT_LINK=${DRONE_COMMIT_LINK} DRONE_REPO_LINK=${DRONE_REPO_LINK} DRONE_BUILD_FINISHED=${DRONE_BUILD_FINISHED} DEBUG=${DEBUG} SESSION_COOKIE_NAME=${SESSION_COOKIE_NAME}
3030
# build NuxtJS project
3131
RUN npm run build
3232

@@ -36,7 +36,7 @@ RUN npm run build
3636
FROM node:18-slim
3737

3838
# pass the global args
39-
ARG COMMUNITY_API_URL
39+
ARG NUXT_COMMUNITY_API_URL
4040
ARG HOST
4141
ARG PORT
4242
ARG USER
@@ -58,7 +58,7 @@ COPY --from=builder --chown=${USER}:${USER} /workspace/node_modules /app/node_mo
5858
COPY --from=builder --chown=${USER}:${USER} /workspace/package.json /app/
5959

6060
# inject build args as enviroment variables
61-
ENV COMMUNITY_API_URL=${COMMUNITY_API_URL} HOST=${HOST} PORT=${PORT} TARGET_ENV=${TARGET_ENV} DRONE_COMMIT_SHA=${DRONE_COMMIT_SHA} DRONE_BUILD_NUMBER=${DRONE_BUILD_NUMBER} DRONE_BUILD_LINK=${DRONE_BUILD_LINK} DRONE_COMMIT_LINK=${DRONE_COMMIT_LINK} DRONE_REPO_LINK=${DRONE_REPO_LINK} DRONE_BUILD_FINISHED=${DRONE_BUILD_FINISHED} DEBUG=${DEBUG} SESSION_COOKIE_NAME=${SESSION_COOKIE_NAME}
61+
ENV NUXT_COMMUNITY_API_URL=${NUXT_COMMUNITY_API_URL} HOST=${HOST} PORT=${PORT} TARGET_ENV=${TARGET_ENV} DRONE_COMMIT_SHA=${DRONE_COMMIT_SHA} DRONE_BUILD_NUMBER=${DRONE_BUILD_NUMBER} DRONE_BUILD_LINK=${DRONE_BUILD_LINK} DRONE_COMMIT_LINK=${DRONE_COMMIT_LINK} DRONE_REPO_LINK=${DRONE_REPO_LINK} DRONE_BUILD_FINISHED=${DRONE_BUILD_FINISHED} DEBUG=${DEBUG} SESSION_COOKIE_NAME=${SESSION_COOKIE_NAME}
6262

6363
# set user context
6464
USER ${USER}

‎components/Form/AppDropDownSearch.vue‎

Lines changed: 44 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -5,33 +5,59 @@
55
</label>
66
<div class="dropdown-wrapper">
77
<div v-if="state.selectedItem" class="selected-item">
8-
<img class="w-1/12" alt="avatar" :src="
9-
state.selectedItem.avatar
10-
? state.selectedItem.avatar
11-
: '/images/placeholders/avatar.png'
12-
" />
13-
<span class="my-auto ml-4">{{ state.selectedItem.first_name_en }}
14-
{{ state.selectedItem.last_name_en }}</span>
8+
<img
9+
class="w-1/12"
10+
alt="avatar"
11+
:src="
12+
state.selectedItem.avatar
13+
? state.selectedItem.avatar
14+
: '/images/placeholders/avatar.png'
15+
"
16+
/>
17+
<span class="my-auto ml-4"
18+
>{{ state.selectedItem.first_name_en }}
19+
{{ state.selectedItem.last_name_en }}</span
20+
>
1521
</div>
1622
<div class="dropdown-popover">
1723
<form @submit.prevent="onSubmit">
18-
<input class="input-field" type="text" :placeholder="placeholderText" v-model="state.searchQuery" />
19-
<svg @submit="onSubmit" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
24+
<input
25+
class="input-field"
26+
type="text"
27+
:placeholder="placeholderText"
28+
v-model="state.searchQuery"
29+
/>
30+
<svg
31+
@submit="onSubmit"
32+
xmlns="http://www.w3.org/2000/svg"
33+
viewBox="0 0 24 24"
34+
width="24"
35+
height="24"
36+
>
2037
<path fill="none" d="M0 0h24v24H0z" />
2138
<path
2239
d="M11 2c4.968 0 9 4.032 9 9s-4.032 9-9 9-9-4.032-9-9 4.032-9 9-9zm0 16c3.867 0 7-3.133 7-7 0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7zm8.485.071l2.829 2.828-1.415 1.415-2.828-2.829 1.414-1.414z"
23-
fill="rgba(153,153,153,1)" />
40+
fill="rgba(153,153,153,1)"
41+
/>
2442
</svg>
2543
</form>
2644
<div class="options" :class="state.isVisible ? 'visible' : 'invisible'">
2745
<ul>
28-
<li @click="selectedItem(member)" v-for="(member, index) in state.members" :key="`member-${index}`"
29-
class="flex flex-row">
30-
<img class="w-1/12" alt="avatar" :src="
31-
member.avatar
32-
? member.avatar
33-
: '/images/placeholders/avatar.png'
34-
" />
46+
<li
47+
@click="selectedItem(member)"
48+
v-for="(member, index) in state.members"
49+
:key="`member-${index}`"
50+
class="flex flex-row"
51+
>
52+
<img
53+
class="w-1/12"
54+
alt="avatar"
55+
:src="
56+
member.avatar
57+
? member.avatar
58+
: '/images/placeholders/avatar.png'
59+
"
60+
/>
3561
<span class="my-auto ml-4">
3662
{{ member.first_name_en }} {{ member.last_name_en }}
3763
</span>
@@ -67,7 +93,7 @@ const props = defineProps({
6793
6894
const onSubmit = async () => {
6995
await fetch(
70-
`${config.public.COMMUNITY_API_URL}/member/search?q=${state.searchQuery}`
96+
`${config.public.communityApiUrl}/member/search?q=${state.searchQuery}`
7197
)
7298
.then((response) => response.json())
7399
.then((data) => {

‎components/member/Banner.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -186,7 +186,7 @@ const uploadImage = async (event, imageType) => {
186186
const image = new FormData()
187187
image.append('file', files[0], files[0].name)
188188
await fetch(
189-
`${config.public.COMMUNITY_API_URL}/upload/members/${imageType}/${
189+
`${config.public.communityApiUrl}/upload/members/${imageType}/${
190190
userId().value
191191
}`,
192192
{

‎components/members/index.vue‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
<template>
22
<div v-if="state.loading" class="loader"></div>
33
<div v-else-if="!state.loading && state.members.length">
4-
<h2 class="text-2xl mono" id="members-found-heading">{{ state.metaData.totalItems }} members found</h2>
4+
<h2 class="text-2xl mono" id="members-found-heading">
5+
{{ state.metaData.totalItems }} members found
6+
</h2>
57
<div v-for="(member, index) in state.members" :key="`item-${index}`">
68
<MembersCard :member="member" />
79
</div>
@@ -50,7 +52,7 @@ const props = defineProps({
5052
5153
const getMembers = async () => {
5254
state.loading = true
53-
let url = `${config.public.COMMUNITY_API_URL}/member/page/${state.page}?`
55+
let url = `${config.public.communityApiUrl}/member/page/${state.page}?`
5456
if (state.passedName) {
5557
url += `name=${state.passedName}&`
5658
}

‎components/mission/index.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@ const emit = defineEmits(['setCategories'])
5555
5656
const getMissions = async () => {
5757
state.loading = true
58-
let url = `${config.public.COMMUNITY_API_URL}/mission/page/${state.page}?`
58+
let url = `${config.public.communityApiUrl}/mission/page/${state.page}?`
5959
6060
if (props.selectedMissionCriteria) {
6161
url += `${props.selectedMissionCriteria?.key}=${props.selectedMissionCriteria?.value}&`

‎components/register/PhaseOne.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@
5858
>
5959
E-mail
6060
</FormAppControlInput>
61-
<FormAppControlInput v-model:value="form.github"
61+
<FormAppControlInput v-model:value="form.github_user"
6262
>Github Account</FormAppControlInput
6363
>
6464
<div class="text-right">
@@ -83,7 +83,7 @@ const form = reactive({
8383
last_name_ar: '',
8484
phone: '',
8585
email: '',
86-
github: '',
86+
github_user: '',
8787
})
8888
8989
const emit = defineEmits(['toggleNext'])

‎components/resetPassword/Form.vue‎

Lines changed: 14 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,13 @@
22
<div class="container input-control">
33
<Message
44
v-if="!state.passwordsMatch"
5-
title="Passwords do not match"
5+
title="Passwords do not match"
66
type="error"
77
class="mb-4"
88
>
99
Please make sure that the password match in both fields.
1010
</Message>
11-
<form
12-
v-if="!state.resetSuccess"
13-
@submit.prevent="reset"
14-
>
11+
<form v-if="!state.resetSuccess" @submit.prevent="reset">
1512
<FormAppControlInput
1613
v-model:value="form.password_1"
1714
input-type="password"
@@ -26,7 +23,7 @@
2623
:is-required="true"
2724
:show-password-icon="true"
2825
>
29-
Confirm new password
26+
Confirm new password
3027
</FormAppControlInput>
3128
<FormAppButton
3229
class="form-submit"
@@ -40,20 +37,13 @@
4037
</div>
4138
</FormAppButton>
4239
</form>
43-
<div
44-
v-if="state.resetSuccess"
45-
class="success-container"
46-
>
40+
<div v-if="state.resetSuccess" class="success-container">
4741
<Message title="Success" type="success" :showCloseBtn="false">
4842
Your password has been successfully reset.
4943
</Message>
5044
<div class="flex flex-row justify-between mt-4">
51-
<NuxtLink to="/login">
52-
Login
53-
</NuxtLink>
54-
<NuxtLink to="/">
55-
Return to homepage
56-
</NuxtLink>
45+
<NuxtLink to="/login"> Login </NuxtLink>
46+
<NuxtLink to="/"> Return to homepage </NuxtLink>
5747
</div>
5848
</div>
5949
</div>
@@ -63,30 +53,30 @@ const config = useRuntimeConfig()
6353
6454
const form = reactive({
6555
password_1: '',
66-
password_2: ''
56+
password_2: '',
6757
})
6858
const state = reactive({
6959
passwordsMatch: true,
7060
resetSuccess: false,
71-
loading: false
61+
loading: false,
7262
})
7363
7464
const reset = async () => {
7565
state.passwordsMatch = form.password_1 === form.password_2
7666
if (state.passwordsMatch) {
7767
state.loading = true
7868
const token = useRoute().query.token
79-
const url = `${config.public.COMMUNITY_API_URL}/auth/reset-password?token=${token}`
80-
69+
const url = `${config.public.communityApiUrl}/auth/reset-password?token=${token}`
70+
8171
await $fetch.raw(url, {
82-
method: "PATCH",
72+
method: 'PATCH',
8373
body: JSON.stringify({
84-
"password": form.password_1
74+
password: form.password_1,
8575
}),
86-
onResponse({response}) {
76+
onResponse({ response }) {
8777
state.loading = false
8878
state.resetSuccess = response._data.success
89-
}
79+
},
9080
})
9181
}
9282
}

‎composables/state.js‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11

22
// store authorization status
3-
export const useAuth = () => useState('auth', () => false)
3+
export const useAuth = () => useState('auth', () => false)
44

55
// store the user id
6-
export const userId = () => useState('userId', () => '')
6+
export const userId = () => useState('userId', () => '')
77

88
// member data required for user widget
9-
export const useMember = () => useState('member', () => {})
9+
export const useMember = () => useState('member', () => { })
1010

1111
// check if user is authenticated and update the store accordingly
1212
export const isAuth = async (cookieName, cookieValue) => {
@@ -15,23 +15,23 @@ export const isAuth = async (cookieName, cookieValue) => {
1515
const member = useMember();
1616
const config = useRuntimeConfig()
1717

18-
const url = `${config.public.COMMUNITY_API_URL}/auth/`
18+
const url = `${config.public.communityApiUrl}/auth/`
1919
await useFetch(url, {
2020
method: 'GET',
2121
headers: {
2222
"Accept": "*/*",
2323
"Cookie": `${cookieName}=${cookieValue}`
2424
},
25-
onResponse({response}) {
25+
onResponse({ response }) {
2626
authenticated.value = response.ok
27-
const {first_name_en, last_name_en, id, avatar_url, type, josa_member_id} = response._data
28-
member.value = {first_name_en, last_name_en, id, avatar_url, type, josa_member_id}
27+
const { first_name_en, last_name_en, id, avatar_url, type, josa_member_id } = response._data
28+
member.value = { first_name_en, last_name_en, id, avatar_url, type, josa_member_id }
2929
userID.value = id
3030
},
31-
onResponseError({response}) {
31+
onResponseError({ response }) {
3232
if (response.status === 403) {
3333
// TODO: handle expired session / unauthorized
3434
}
3535
}
3636
})
37-
}
37+
}

0 commit comments

Comments
 (0)