adjust scss/sass vite config, switch to nc/vue for dashboard widget component

Signed-off-by: Julien Veyssier <julien-nc@posteo.net>

src/dashboard.js

@@ -9,16 +9,10 @@
  * @copyright Julien Veyssier 2020
  */
 
-// import { linkTo } from '@nextcloud/router'
-// import { getRequestToken } from '@nextcloud/auth'
-
-// __webpack_nonce__ = btoa(getRequestToken()) // eslint-disable-line
-// __webpack_public_path__ = linkTo('cospend', 'js/') // eslint-disable-line
-
 document.addEventListener('DOMContentLoaded', () => {
 	OCA.Dashboard.register('cospend_activity', async (el, { widget }) => {
-		const { default: Vue } = await import(/* webpackChunkName: "dashboard-lazy" */'vue')
-		const { default: Dashboard } = await import(/* webpackChunkName: "dashboard-lazy" */'./views/Dashboard.vue')
+		const { default: Vue } = await import('vue')
+		const { default: Dashboard } = await import('./views/Dashboard.vue')
 		Vue.mixin({ methods: { t, n } })
 		const View = Vue.extend(Dashboard)
 		new View({

src/main.js

@@ -31,9 +31,6 @@ Vue.use(VueClipboard)
 Vue.use(SmartTable)
 Vue.directive('tooltip', Tooltip)
 
-// __webpack_nonce__ = btoa(getRequestToken()) // eslint-disable-line
-// __webpack_public_path__ = generateFilePath('cospend', '', 'js/') // eslint-disable-line
-
 function restoreOptions() {
 	network.getOptionValues().then((response) => {
 		getOptionValuesSuccess(response.data)

src/views/Dashboard.vue

@@ -1,5 +1,5 @@
 <template>
-	<DashboardWidget :items="items"
+	<NcDashboardWidget :items="items"
 		:show-more-url="showMoreUrl"
 		:show-more-text="title"
 		:loading="state === 'loading'">
@@ -19,7 +19,7 @@
 				</template>
 			</NcEmptyContent>
 		</template>
-	</DashboardWidget>
+	</NcDashboardWidget>
 </template>
 
 <script>
@@ -29,7 +29,8 @@ import axios from '@nextcloud/axios'
 import { generateUrl, generateOcsUrl } from '@nextcloud/router'
 import { getCurrentUser } from '@nextcloud/auth'
 import moment from '@nextcloud/moment'
-import { DashboardWidget } from '@nextcloud/vue-dashboard'
+
+import NcDashboardWidget from '@nextcloud/vue/dist/Components/NcDashboardWidget.js'
 import NcEmptyContent from '@nextcloud/vue/dist/Components/NcEmptyContent.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 
@@ -38,7 +39,7 @@ export default {
 
 	components: {
 		CospendIcon,
-		DashboardWidget,
+		NcDashboardWidget,
 		NcEmptyContent,
 		NcButton,
 	},

vite.config.ts

@@ -19,6 +19,11 @@ export default createAppConfig({
 			modules: {
 				localsConvention: 'camelCase',
 			},
+			preprocessorOptions: {
+				scss: {
+					api: 'modern-compiler',
+				},
+			},
 		},
 		plugins: [eslint(), stylelint()],
 	},