Skip to content

Commit

Permalink
Merge branch 'bcgov:main' into main
Browse files Browse the repository at this point in the history
  • Loading branch information
avni-work authored Oct 21, 2024
2 parents 370a6da + 1117775 commit eec5c4b
Show file tree
Hide file tree
Showing 13 changed files with 368 additions and 26 deletions.
2 changes: 1 addition & 1 deletion strr-platform-web/app/assets/styles/layout.css
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
}

.app-inner-container {
@apply max-w-bcGovLg w-[100vw] mx-auto px-4;
@apply max-w-bcGovLg w-full mx-auto px-4;
}

.app-body {
Expand Down
2 changes: 2 additions & 0 deletions strr-platform-web/app/components/connect/ButtonControl.vue
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,8 @@ const rightButtons = computed(() => buttonControl.value?.rightButtons || [])
:label="button.label"
:trailing="button.trailing || false"
:variant="button.variant || 'solid'"
:disabled="button.disabled || false"
:loading="button.loading || false"
data-testid="button-control-left-button"
@click="button.action()"
/>
Expand Down
2 changes: 1 addition & 1 deletion strr-platform-web/app/components/connect/fee/Widget.vue
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ watch(isFoldable, (val) => {
})
const toggleFolded = () => {
if (isFoldable) {
if (isFoldable.value) {
folded.value = !folded.value
}
}
Expand Down
85 changes: 85 additions & 0 deletions strr-platform-web/app/components/modal/Base.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
<script setup lang="ts">
const modalModel = defineModel({ type: Boolean, default: false })
const isSmallScreen = useMediaQuery('(max-width: 640px)')
defineProps<{
title?: string
content?: string
actions?: { label: string, handler:() => void, color?: string, variant?: string }[]
error?: {
title: string
description: string
// showContactInfo?: boolean
},
fullscreen?: boolean
}>()
defineEmits<{
modalClosed: [void]
}>()
</script>
<template>
<UModal
v-model="modalModel"
:fullscreen
:ui="{
width: 'w-full sm:max-w-lg md:min-w-min'
}"
@after-leave="$emit('modalClosed')"
>
<UCard
:ui="{
divide: '',
rounded: fullscreen ? 'rounded-none' : 'rounded-lg',
base: fullscreen ? 'h-screen' : ''
}"
>
<template #header>
<div class="flex items-center justify-between">
<span class="text-xl font-semibold text-bcGovColor-darkGray">{{ title }}</span>
<UButton
:ui="{ icon: { base: 'shrink-0 scale-150' } }"
icon="i-mdi-close"
color="primary"
:aria-label="$t('btn.close')"
square
variant="ghost"
@click="modalModel = false"
/>
</div>
</template>
<slot>
<p v-if="content" class="text-bcGovColor-midGray">
{{ content }}
</p>
<div v-if="error" class="flex flex-col items-center gap-4 text-center">
<UIcon name="i-mdi-alert-circle-outline" class="-mt-10 size-8 text-red-500" />
<h2 class="text-xl font-semibold">
{{ error.title }}
</h2>
<p>{{ error.description }}</p>
<!-- should we have a contact info section ?? -->
<!-- <p v-if="error.showContactInfo" class="self-start">
Please contact us if you require assistance.
</p>
<BCRegContactInfo v-if="error.showContactInfo" class="self-start text-left" /> -->
</div>
</slot>
<template v-if="actions !== undefined || $slots.footer" #footer>
<slot name="footer">
<div v-if="actions !== undefined" class="flex flex-wrap items-center justify-center gap-4">
<UButton
v-for="(action, index) in actions"
:key="index"
:block="isSmallScreen"
:label="action.label"
:variant="action.variant || 'solid'"
:color="action.color || 'primary'"
@click="action.handler"
/>
</div>
</slot>
</template>
</UCard>
</UModal>
</template>
26 changes: 26 additions & 0 deletions strr-platform-web/app/composables/useStrrModals.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
// https://ui.nuxt.com/components/modal#control-programmatically
import { ModalBase } from '#components'

export const useStrrModals = () => {
const modal = useModal()
const { t } = useI18n()

function openAppSubmitError () {
modal.open(ModalBase, {
error: {
title: 'Error submitting application', // need to come up with different error messages for different scenarios
description: 'Some description here.'
},
actions: [{ label: t('btn.close'), handler: () => close() }]
})
}

function close () {
modal.close()
}

return {
openAppSubmitError,
close
}
}
3 changes: 3 additions & 0 deletions strr-platform-web/app/enums/application-type.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export enum ApplicationType {
PLATFORM = 'PLATFORM'
}
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,5 @@ export interface ConnectBtnControlItem {
loading?: boolean
variant?: string
trailing?: boolean
disabled?: boolean
}
53 changes: 53 additions & 0 deletions strr-platform-web/app/interfaces/platform-application.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
export interface ApiAddress {
country: string
address: string
addressLineTwo: string
city: string
province: string
postalCode: string
}

export interface ApiParty {
firstName: string
lastName: string
middleName: string
phoneNumber: string
extension: string
faxNumber: string
emailAddress: string
}

export interface ApiRep extends ApiParty {
jobTitle: string
}

export interface ApiBusinessDetails {
legalName: string
homeJurisdiction: string
businessNumber: string
consumerProtectionBCLicenceNumber: string
noticeOfNonComplianceEmail: string
noticeOfNonComplianceOptionalEmail: string
takeDownRequestEmail: string
takeDownRequestOptionalEmail: string
mailingAddress: ApiAddress
registeredOfficeOrAttorneyForServiceDetails: {
attorneyName: string
mailingAddress: ApiAddress
}
}

export interface ApiPlatformDetails {
brands: PlatBrand[]
listingSize: ListingSize
}

export interface PlatformApplicationPayload {
registration: {
registrationType: ApplicationType
completingParty: ApiParty
platformRepresentatives: ApiRep[]
businessDetails: ApiBusinessDetails
platformDetails: ApiPlatformDetails
}
}
6 changes: 3 additions & 3 deletions strr-platform-web/app/layouts/connect-form.vue
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,12 @@
class="app-inner-container app-body"
data-testid="strr-form-layout-slot"
>
<div class="flex">
<div class="flex flex-col lg:flex-row">
<div class="grow">
<slot />
</div>
<aside class="fixed bottom-3 z-50 w-full pr-8 lg:relative lg:mt-[96px] lg:w-[340px] lg:px-5">
<ConnectFeeWidget class="lg:sticky lg:top-10" />
<aside class="sticky bottom-0 z-10 w-full lg:static lg:mt-[96px] lg:w-[340px] lg:px-5">
<ConnectFeeWidget class="sticky lg:top-10" />
</aside>
</div>
</main>
Expand Down
68 changes: 59 additions & 9 deletions strr-platform-web/app/pages/platform/application.vue
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ onMounted(async () => {
const { platformDetails } = storeToRefs(useStrrPlatformDetails())
const { platformBusiness } = storeToRefs(useStrrPlatformBusiness())
// const { getBusinessSchema } = useStrrPlatformBusiness()
watch(() => platformBusiness.value.hasCpbc, (val) => {
if (val && platFeeWv.value) {
removeFee(ConnectFeeCode.STR_PLAT_SM)
Expand Down Expand Up @@ -118,16 +119,65 @@ const setPreviousStep = () => {
}
}
// something like this? need to discuss options
// how can we set loading state on the submit and pay button?
// i wonder if tracking the steps in a store would be useful
const handlePlatformSubmit = () => {
// validate each step
// if invalid step, set prop on Review component to highlight invalid fields/section ?
// show alert with some error text ?
// need to cleanup the setButtonControl somehow
const handlePlatformSubmit = async () => {
try {
// set buttons to loading state
setButtonControl({
leftButtons: [
{
action: setPreviousStep,
icon: 'i-mdi-chevron-left',
label: t('btn.back'),
variant: 'outline',
disabled: true
},
{
action: handlePlatformSubmit,
icon: 'i-mdi-chevron-right',
label: t('btn.submitAndPay'),
trailing: true,
loading: true
}
],
rightButtons: []
})
// something like this but cleaner
// validate all forms
// const isCompletingPartyValid = getContactSchema(true).safeParse(completingParty.value).success
// const isPrimaryRepValid = getContactSchema(false).safeParse(primaryRep.value).success
// if (secondaryRep.value) {
// const isSecondaryRepValid = getContactSchema(false).safeParse(secondaryRep.value).success
// }
// const isBusDetailsValid = getBusinessSchema(
// platformBusiness.value.hasCpbc, platformBusiness.value.hasRegOffAtt)
// console.log(isCompletingPartyValid)
// if all steps valid, submit form with store function
await submitPlatformApplication()
} catch (e) {
// if all steps valid, submit form with store function
submitPlatformApplication()
} finally {
// set buttons back to non loading state
setButtonControl({
leftButtons: [
{
action: setPreviousStep,
icon: 'i-mdi-chevron-left',
label: t('btn.back'),
variant: 'outline'
},
{
action: handlePlatformSubmit,
icon: 'i-mdi-chevron-right',
label: t('btn.submitAndPay'),
trailing: true
}
],
rightButtons: []
})
}
}
watch(activeStepIndex, (val) => {
Expand Down
29 changes: 29 additions & 0 deletions strr-platform-web/app/plugins/strr-api.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
export default defineNuxtPlugin(() => {
const strrApiUrl = useRuntimeConfig().public.strrApiURL
const accountStore = useConnectAccountStore()

const { $keycloak } = useNuxtApp()

const api = $fetch.create({
baseURL: strrApiUrl,
onRequest ({ options }) {
const headers = options.headers ||= {}
if (Array.isArray(headers)) {
headers.push(['Authorization', `Bearer ${$keycloak.token}`])
headers.push(['Account-Id', accountStore.currentAccount.id])
} else if (headers instanceof Headers) {
headers.set('Authorization', `Bearer ${$keycloak.token}`)
headers.set('Account-Id', accountStore.currentAccount.id)
} else {
headers.Authorization = `Bearer ${$keycloak.token}`
headers['Account-Id'] = accountStore.currentAccount.id
}
}
})

return {
provide: {
strrApi: api
}
}
})
Loading

0 comments on commit eec5c4b

Please sign in to comment.