diff --git a/client/src/components/Common/TextShort.vue b/client/src/components/Common/TextShort.vue
index 00d32e2dbdfe..012c770c6137 100644
--- a/client/src/components/Common/TextShort.vue
+++ b/client/src/components/Common/TextShort.vue
@@ -1,16 +1,15 @@
 <script setup lang="ts">
 import { computed } from "vue";
 
-const props = defineProps({
-    text: {
-        type: String,
-        required: true,
-    },
-    maxLength: {
-        type: Number,
-        default: 24,
-    },
+interface Props {
+    text: string;
+    maxLength?: number;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+    maxLength: 24,
 });
+
 const text = computed(() => {
     if (props.text.length > props.maxLength) {
         const partialText = props.text.slice(0, props.maxLength);