fix(vue): add lang attrs, fix ESLint issues in Vue components

resources/js/components/GridCanvas.vue

@@ -4,7 +4,7 @@
   </div>
 </template>
 
-<script setup>
+<script setup lang="ts">
 import { ref, onMounted, onBeforeUnmount, watch } from 'vue';
 
 const props = defineProps({
@@ -23,7 +23,7 @@ const height = 800;
 
   let isPanning = false;
   let start = { x: 0, y: 0 };
-  let offset = { x: 0, y: 0 };
+  const offset = { x: 0, y: 0 };
   let scale = 1;
   let pinchActive = false;
   let lastDistance = 0;
@@ -186,7 +186,7 @@ onMounted(() => {
     drawGrid();
   });
 
-  c.addEventListener('pointerup', (e) => {
+  c.addEventListener('pointerup', () => {
     if (selecting && selection) {
       // finalize selection and emit one last time
       const relX = selection.x - offset.x;

resources/js/components/SelectionSidebar.vue

@@ -9,7 +9,9 @@
   </aside>
 </template>
 
-<script setup>
+<script setup lang="ts">
+import { computed } from 'vue';
+
 const props = defineProps({
   cellCount: { type: Number, default: 0 },
   pricePerCell: { type: Number, default: 0 },

resources/js/components/UploadModal.vue

@@ -14,17 +14,18 @@
   </div>
 </template>
 
-<script setup>
+<script setup lang="ts">
 import { ref } from 'vue';
-const props = defineProps({ selection: { type: Object, default: null } });
+defineProps({ selection: { type: Object, default: null } });
-const preview = ref(null);
+const preview = ref<string | null>(null);
 
-function onFile(e) {
+function onFile(e: Event) {
-  const file = e.target.files && e.target.files[0];
+  const input = e.target as HTMLInputElement | null;
+  const file = input && input.files ? input.files[0] : null;
   if (!file) return;
   const reader = new FileReader();
   reader.onload = (ev) => {
-    preview.value = ev.target.result;
+    preview.value = ev.target && (ev.target as FileReader).result as string | null;
   };
   reader.readAsDataURL(file);
 }

resources/js/pages/PublicGrid/Index.vue

@@ -19,7 +19,7 @@
   </div>
 </template>
 
-<script setup>
+<script setup lang="ts">
 import { ref, onMounted } from 'vue';
 import GridCanvas from '@/components/GridCanvas.vue';
 import SelectionSidebar from '@/components/SelectionSidebar.vue';