feat: logics to handle data from backend, new design & pages

Author: hannoeru

.env.development

@@ -0,0 +1 @@
+VITE_API_ENDPOINT=https://shared-tw.herokuapp.com

.env renamed to .env.production

@@ -16,11 +16,13 @@ declare module 'vue' {
     AppLink: typeof import('./src/components/atoms/AppLink.vue')['default']
     AppLogo: typeof import('./src/components/atoms/AppLogo.vue')['default']
     ApplyHeader: typeof import('./src/components/organisms/apply/ApplyHeader.vue')['default']
-    ApplyListHeader: typeof import('./src/components/molecules/ApplyListHeader.vue')['default']
-    ApplyListItem: typeof import('./src/components/molecules/ApplyListItem.vue')['default']
+    ApplyItemInfo: typeof import('./src/components/molecules/apply/ApplyItemInfo.vue')['default']
+    ApplyListItem: typeof import('./src/components/molecules/apply/ApplyListItem.vue')['default']
+    ApplyOrgInfoBar: typeof import('./src/components/organisms/apply/ApplyOrgInfoBar.vue')['default']
     ApplySupply: typeof import('./src/components/templates/ApplySupply.vue')['default']
     ApplySupplyList: typeof import('./src/components/organisms/apply/ApplySupplyList.vue')['default']
     ApplyToolbar: typeof import('./src/components/organisms/apply/ApplyToolbar.vue')['default']
+    AppModal: typeof import('./src/components/molecules/AppModal.vue')['default']
     AppPopover: typeof import('./src/components/molecules/AppPopover.vue')['default']
     AppSelect: typeof import('./src/components/molecules/AppSelect.vue')['default']
     AppTitle: typeof import('./src/components/atoms/AppTitle.vue')['default']
@@ -29,8 +31,6 @@ declare module 'vue' {
     DonateSchedule: typeof import('./src/components/organisms/DonateSchedule.vue')['default']
     DonatorRegisterForm: typeof import('./src/components/organisms/DonatorRegisterForm.vue')['default']
     FlashMessage: typeof import('./src/components/global/FlashMessage.vue')['default']
-    'Fluent:checkboxChecked20Filled': typeof import('virtual:vite-icons/fluent/checkbox-checked20-filled')['default']
-    'Fluent:checkboxUnchecked20Regular': typeof import('virtual:vite-icons/fluent/checkbox-unchecked20-regular')['default']
     FormActions: typeof import('./src/components/molecules/form/FormActions.vue')['default']
     FormCheckbox: typeof import('./src/components/molecules/form/FormCheckbox.vue')['default']
     FormErrorMessage: typeof import('./src/components/atoms/FormErrorMessage.vue')['default']
@@ -44,13 +44,8 @@ declare module 'vue' {
     JamCloseCircleF: typeof import('virtual:vite-icons/jam/close-circle-f')['default']
     LoginForm: typeof import('./src/components/organisms/LoginForm.vue')['default']
     LoginPage: typeof import('./src/components/templates/LoginPage.vue')['default']
-    'Mdi:close': typeof import('virtual:vite-icons/mdi/close')['default']
     'Mdi:loading': typeof import('virtual:vite-icons/mdi/loading')['default']
-    'MdiLight:delete': typeof import('virtual:vite-icons/mdi-light/delete')['default']
-    'MdiLight:minus': typeof import('virtual:vite-icons/mdi-light/minus')['default']
-    'MdiLight:plus': typeof import('virtual:vite-icons/mdi-light/plus')['default']
     NotFound: typeof import('./src/components/templates/NotFound.vue')['default']
-    OrgInfoNavBar: typeof import('./src/components/organisms/org/OrgInfoNavBar.vue')['default']
     OrgListCard: typeof import('./src/components/organisms/org/OrgListCard.vue')['default']
     OrgRegisterForm: typeof import('./src/components/organisms/org/OrgRegisterForm.vue')['default']
     ProcessLine: typeof import('./src/components/molecules/ProcessLine.vue')['default']
@@ -63,9 +58,13 @@ declare module 'vue' {
     SupplyCardList: typeof import('./src/components/organisms/SupplyCardList.vue')['default']
     SupplyModal: typeof import('./src/components/organisms/SupplyModal.vue')['default']
     TheHeader: typeof import('./src/components/templates/TheHeader.vue')['default']
-    'Uil:angleDoubleLeft': typeof import('virtual:vite-icons/uil/angle-double-left')['default']
-    'Uil:angleDoubleRight': typeof import('virtual:vite-icons/uil/angle-double-right')['default']
     'Uil:angleLeft': typeof import('virtual:vite-icons/uil/angle-left')['default']
+    'Uil:filter': typeof import('virtual:vite-icons/uil/filter')['default']
+    'Uil:infoCircle': typeof import('virtual:vite-icons/uil/info-circle')['default']
+    'Uil:minus': typeof import('virtual:vite-icons/uil/minus')['default']
+    'Uil:multiply': typeof import('virtual:vite-icons/uil/multiply')['default']
+    'Uil:plus': typeof import('virtual:vite-icons/uil/plus')['default']
+    'Uil:trashAlt': typeof import('virtual:vite-icons/uil/trash-alt')['default']
     'Uim:checkCircle': typeof import('virtual:vite-icons/uim/check-circle')['default']
     'Uim:circle': typeof import('virtual:vite-icons/uim/circle')['default']
     WithHeader: typeof import('./src/components/atoms/layouts/WithHeader.vue')['default']

components.d.ts

@@ -0,0 +1,25 @@
+import { onMounted, ref } from 'vue'
+import { donationApi } from '@/api'
+
+import type { GroupedRequiredItems } from '@/api'
+import { AxiosError } from 'axios'
+
+const items = ref<GroupedRequiredItems[] | null>(null)
+
+export function getDonationItems() {
+  const error = ref<AxiosError | undefined>()
+  onMounted(async() => {
+    if (items.value) return
+    await donationApi
+      .listRequiredItems()
+      .then(({ data }) => {
+        items.value = data
+      })
+      .catch(e => error.value = e)
+  })
+
+  return {
+    items,
+    error,
+  }
+}