Merge pull request #354 from vuejs-jp/enhance/end-create-namecard

endedCreateNamecard

Author: jiyuujin

apps/web/app/components/admin/AttendeeList.vue

@@ -2,6 +2,7 @@
 import type { Attendee } from '@vuejs-jp/model'
 import { ref } from 'vue'
 import { useSupabase } from '~/composables/useSupabase'
+import { endedCreateNamecard } from '~/utils/constants'
 
 interface AttendeeListProps {
   attendees: Attendee[]
@@ -79,6 +80,7 @@ const handleConfirm = (attendee?: Attendee) => {
           class="action"
           background-color="white"
           color="vue-blue"
+          :disabled="endedCreateNamecard"
           @click="() => handleDialog(attendee?.id)"
         >
           Edit
@@ -88,6 +90,7 @@ const handleConfirm = (attendee?: Attendee) => {
           class="action"
           background-color="white"
           color="vue-blue"
+          :disabled="endedCreateNamecard"
           @click="() => handleConfirm(attendee)"
         >
           {{ attendee.activated_at ? 'Deactivate' : 'Activate' }}

apps/web/app/components/ticket/NamecardSection.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useLocaleCurrent } from '~/composables/useLocaleCurrent'
-import { ticketUrl } from '~/utils/constants'
+import { endedCreateNamecard, ticketUrl } from '~/utils/constants'
 
 const { locale: currentLocale } = useLocaleCurrent()
 </script>
@@ -32,7 +32,7 @@ const { locale: currentLocale } = useLocaleCurrent()
           background-color="vue-green/200"
           color="white"
         >
-          {{ $t('namecard.createNamecard') }}
+          {{ endedCreateNamecard ? $t('namecard.confirmNamecard') : $t('namecard.createNamecard') }}
         </VFLinkButton>
         <VFLinkButton
           class="action-button"

apps/web/app/lang/en.json

@@ -234,7 +234,8 @@
     "sectionTitle1": "With your avatar and name on it!",
     "sectionTitle2": "Namecard",
     "createNamecard": "Create Namecard",
-    "title_edit": "Create/Edit Name Card",
+    "confirmNamecard": "Confirm Namecard",
+    "title_edit": "Create/Edit Namecard",
     "cancel": "Cancel",
     "edit": "Edit",
     "login_title": "Login via social account",

apps/web/app/lang/ja.json

@@ -252,6 +252,7 @@
     "sectionTitle1": "アバター＋名前入りがもらえる！",
     "sectionTitle2": "ネームカード",
     "createNamecard": "ネームカードを作成する",
+    "confirmNamecard": "ネームカードを確認する",
     "title_edit": "ネームカード作成・編集",
     "cancel": "キャンセル",
     "edit": "編集する",

apps/web/app/utils/constants.ts

@@ -49,6 +49,8 @@ export const endedApplyEarly = true
 
 export const endedApplyHandson = true
 
+export const endedCreateNamecard = true
+
 export const displayNameMaxLength = 24
 
 export const personalSponsors = [

packages/ui/components/link/LinkButton.vue

@@ -12,12 +12,14 @@ interface LinkButtonProps extends /* @vue-ignore */ _LinkButtonProps {
   href?: string
   target?: string
   iconName?: IconName
+  disabled?: boolean
 }
 const props = withDefaults(defineProps<LinkButtonProps>(), {
   is: 'a',
   href: '',
   target: '_blank',
   iconName: undefined,
+  disabled: false,
 })
 
 const { color: updateColor } = useColor()
@@ -65,6 +67,7 @@ const iconColor = computed(() => {
     :is="is ?? 'a'"
     :href
     :target
+    :disabled
     :style
     class="link-button"
     @mouseover="hoverIn"
@@ -103,6 +106,10 @@ const iconColor = computed(() => {
 .link-button:hover {
   transition: 0.2s;
 }
+.link-button:disabled {
+  pointer-events: none;
+  opacity: 0.6;
+}
 .icon {
   margin-right: calc(var(--unit) * 1);
   width: var(--icon-size);