improve tooltips integration

components/btn/Clipboard.vue

@@ -4,6 +4,7 @@
 			id="btncopy"
 			class="btn btn-info px-4 py-1"
 			type="button"
+			v-tooltip="$t('copie') + ' !'"
 			@click="copyText">
 			<outline-clipboard-copy-icon class="icon" />
 		</button>
@@ -16,8 +17,6 @@
 </template>
 
 <script>
-import Tooltip from "~/node_modules/bootstrap/js/dist/tooltip"
-
 export default {
 	props: {
 		textContent: {
@@ -28,16 +27,6 @@ export default {
 	methods: {
 		copyText() {
 			navigator.clipboard.writeText(this.textContent)
-			let btn = document.querySelector("#btncopy")
-			let tooltip = new Tooltip(btn, {
-				title: this.$t("copie") + " !",
-				trigger: "manual"
-			})
-
-			tooltip.show()
-			setTimeout(() => {
-				tooltip.hide()
-			}, 1000)
 		}
 	}
 }

components/member/Card.vue

@@ -12,6 +12,11 @@
 				<button
 					id="favori"
 					class="btn btn-info"
+					v-tooltip="
+						$favourites.list.includes(hash.uid)
+							? $t('favoris.supprime')
+							: $t('favoris.enregistre')
+					"
 					@click="$favourites.toggleFavourite(hash.uid, $event)">
 					<outline-user-add-icon
 						class="icon"

nuxt.config.js

@@ -30,7 +30,11 @@ export default {
 	css: ["@/assets/css/style.scss"],
 
 	// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
-	plugins: ["~plugins/favourites.js", "~plugins/filters.js"],
+	plugins: [
+		"~plugins/favourites.js",
+		"~plugins/filters.js",
+		"~plugins/bootstrap.js"
+	],
 
 	// Auto import components: https://go.nuxtjs.dev/config-components
 	components: true,
@@ -123,7 +127,5 @@ export default {
 	},
 
 	// Build Configuration: https://go.nuxtjs.dev/config-build
-	build: {
-		plugins: []
-	}
+	build: {}
 }

plugins/bootstrap.js

+import Vue from "vue"
+import Tooltip from "~/node_modules/bootstrap/js/dist/tooltip"
+
+Vue.directive("tooltip", function (el, binding) {
+	let tooltip = {}
+
+	tooltip = new Tooltip(el, {
+		title: binding.value,
+		html: true,
+		trigger: "manual"
+	})
+
+	el.onclick = function () {
+		tooltip.show()
+		setTimeout(() => {
+			tooltip.hide()
+		}, 1000)
+	}
+})

plugins/favourites.js

 import Vue from "vue"
-import Tooltip from "~/node_modules/bootstrap/js/dist/tooltip"
 
 export default (context, inject) => {
 	let liste_favoris = localStorage.favourites
@@ -7,22 +6,6 @@ export default (context, inject) => {
 		: []
 
 	let toggleFavourite = (uid, e) => {
-		let btn = e.currentTarget
-		let tooltip = new Tooltip(btn, {
-			title: function () {
-				return context.$favourites.list.includes(uid)
-					? context.app.i18n.t("favoris.supprime")
-					: context.app.i18n.t("favoris.enregistre")
-			},
-			html: true,
-			trigger: "manual"
-		})
-
-		tooltip.show()
-		setTimeout(() => {
-			tooltip.hide()
-		}, 1000)
-
 		if (!context.$favourites.list.includes(uid)) {
 			context.$favourites.list.push(uid)
 		} else {