chore: typescript introduction

.eslintrc.js

@@ -6,4 +6,15 @@ module.exports = {
 	extends: [
 		'@nextcloud',
 	],
+	overrides: [
+		{
+			files: ['**/*.ts', '**/*.tsx'],
+			extends: [
+				'@nextcloud',
+				'@nextcloud/eslint-config/typescript',
+			],
+			parser: '@typescript-eslint/parser',
+			plugins: ['@typescript-eslint'],
+		},
+	],
 }

package.json

@@ -27,13 +27,14 @@
     "build": "webpack --node-env production --progress",
     "dev": "webpack --node-env development --progress",
     "watch": "webpack --node-env development --progress --watch",
-    "lint": "eslint --ext .js,.vue src",
-    "lint:fix": "eslint --ext .js,.vue src --fix",
+    "lint": "eslint --ext .js,.vue,.ts src",
+    "lint:fix": "eslint --ext .js,.vue,.ts src --fix",
     "stylelint": "stylelint \"css/*.css\" \"css/*.scss\" \"src/**/*.scss\" \"src/**/*.vue\"",
     "stylelint:fix": "stylelint \"css/*.css\" \"css/*.scss\" \"src/**/*.scss\" \"src/**/*.vue\" --fix",
     "test": "jest",
     "test:watch": "jest --watch",
-    "test:coverage": "jest --coverage"
+    "test:coverage": "jest --coverage",
+    "type-check": "tsc --noEmit"
   },
   "dependencies": {
     "@fullcalendar/core": "6.1.17",
@@ -95,7 +96,14 @@
     "@nextcloud/browserslist-config": "^3.0.1",
     "@nextcloud/eslint-config": "^8.4.1",
     "@nextcloud/stylelint-config": "^3.1.0",
+    "@nextcloud/typings": "^1.9.1",
     "@nextcloud/webpack-vue-config": "^6.2.0",
+    "@types/jest": "^29.5.5",
+    "@types/node": "^20.8.0",
+    "@types/webpack": "^5.28.5",
+    "@types/webpack-env": "^1.18.8",
+    "@typescript-eslint/eslint-plugin": "^7.18.0",
+    "@typescript-eslint/parser": "^7.18.0",
     "@vue/test-utils": "^2.4.6",
     "@vue/vue2-jest": "^29.2.6",
     "babel-jest": "^29.7.0",
@@ -104,6 +112,8 @@
     "jest-environment-jsdom": "^29.7.0",
     "jest-serializer-vue": "^3.1.0",
     "resolve-url-loader": "^5.0.0",
+    "ts-loader": "^9.4.4",
+    "typescript": "^5.2.2",
     "vue-template-compiler": "^2.7.16"
   },
   "optionalDependencies": {
@@ -112,6 +122,7 @@
   "jest": {
     "moduleFileExtensions": [
       "js",
+      "ts",
       "vue"
     ],
     "moduleNameMapper": {
@@ -120,6 +131,7 @@
     },
     "transform": {
       ".*\\.js$": "<rootDir>/node_modules/babel-jest",
+      ".*\\.ts$": "<rootDir>/node_modules/babel-jest",
       ".*\\.(vue)$": "<rootDir>/node_modules/@vue/vue2-jest"
     },
     "snapshotSerializers": [
@@ -128,7 +140,7 @@
     "coverageDirectory": "./coverage/",
     "collectCoverage": true,
     "collectCoverageFrom": [
-      "<rootDir>/src/**/*.{js,vue}",
+      "<rootDir>/src/**/*.{js,ts,vue}",
       "!**/node_modules/**"
     ],
     "coverageReporters": [

src/env.d.ts

@@ -0,0 +1,13 @@
+/**
+ * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import type { getCSPNonce } from '@nextcloud/auth'
+
+declare global {
+	let __webpack_nonce__: ReturnType<typeof getCSPNonce>
+	let __webpack_public_path__: string
+}
+
+export {}

src/types/vue-shim.d.ts

@@ -0,0 +1,43 @@
+/**
+ * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+declare module '*.vue' {
+  import Vue from 'vue'
+  export default Vue
+}
+
+declare module '@nextcloud/*' {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const content: any
+  export = content
+}
+
+declare module 'vue-material-design-icons/*' {
+  import Vue from 'vue'
+  export default Vue
+}
+
+declare module 'v-tooltip' {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const content: any
+  export = content
+}
+
+declare module 'vuedraggable' {
+  import Vue from 'vue'
+  export default Vue
+}
+
+declare module 'vue-shortkey' {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const content: any
+  export = content
+}
+
+declare module 'vue-click-outside' {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const content: any
+  export = content
+}

tsconfig.json

@@ -0,0 +1,19 @@
+{
+	"include": ["src/**/*.ts", "src/**/*.vue", "src/env.d.ts"],
+	"compilerOptions": {
+		"module": "ESNext",
+		"moduleResolution": "bundler",
+		"target": "ESNext",
+		"strictNullChecks": true,
+		"sourceMap": true,
+		"allowSyntheticDefaultImports": true,
+		"declaration": false,
+		"baseUrl": ".",
+		"paths": {
+			"@/*": ["src/*"]
+		}
+	},
+	"vueCompilerOptions": {
+		"target": "2.7"
+	}
+}

tsconfig.json.license

@@ -0,0 +1,2 @@
+SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors
+SPDX-License-Identifier: AGPL-3.0-or-later

webpack.config.js

@@ -18,6 +18,14 @@ webpackConfig.entry['appointments-confirmation'] = path.join(__dirname, 'src', '
 webpackConfig.entry['appointments-conflict'] = path.join(__dirname, 'src', 'appointments/main-conflict.js')
 webpackConfig.entry['appointments-overview'] = path.join(__dirname, 'src', 'appointments/main-overview.js')
 
+webpackConfig.resolve = {
+	...webpackConfig.resolve,
+	alias: {
+		...webpackConfig.resolve.alias,
+		'@': path.resolve(__dirname, 'src'),
+	}
+}
+
 // Edit JS rule
 webpackRules.RULE_JS.test = /\.m?js$/
 webpackRules.RULE_JS.exclude = BabelLoaderExcludeNodeModulesExcept([