From 72ebf01a8a17ec13f45ea254297773dabcd59cf5 Mon Sep 17 00:00:00 2001
From: Felix Beichler <felix@beichlers.de>
Date: Sun, 12 May 2024 15:30:49 +0200
Subject: [PATCH] move modal into tab vue

Signed-off-by: Felix Beichler <felix@beichlers.de>
---
 src/components/QrModal.vue                    | 109 ------------------
 .../SidebarTabs/SharingSidebarTab.vue         |  40 ++++---
 2 files changed, 27 insertions(+), 122 deletions(-)
 delete mode 100644 src/components/QrModal.vue

diff --git a/src/components/QrModal.vue b/src/components/QrModal.vue
deleted file mode 100644
index 52640fdb3..000000000
--- a/src/components/QrModal.vue
+++ /dev/null
@@ -1,109 +0,0 @@
-<!--
-  - @copyright Copyright (c) 2023 René Gieling <github@dartcafe.de>
-  -
-  - @author René Gieling <github@dartcafe.de>
-  -
-  - @license GNU AGPL version 3 or any later version
-  -
-  - This program is free software: you can redistribute it and/or modify
-  - it under the terms of the GNU Affero General Public License as
-  - published by the Free Software Foundation, either version 3 of the
-  - License, or (at your option) any later version.
-  -
-  - This program is distributed in the hope that it will be useful,
-  - but WITHOUT ANY WARRANTY; without even the implied warranty of
-  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-  - GNU Affero General Public License for more details.
-  -
-  - You should have received a copy of the GNU Affero General Public License
-  - along with this program.  If not, see <http://www.gnu.org/licenses/>.
-  -
-  -->
-
-  <template>
-	<div class="qr-code">
-		<h2>{{ name }}</h2>
-		<slot name="description">
-			{{ description }}
-		</slot>
-		<div class="canvas">
-			<img :src="qrUri" :alt="encodeText">
-		</div>
-		<h3>{{ subTitle }}</h3>
-		<p />
-		<p class="qr-url">
-			{{ encodeText }}
-		</p>
-	</div>
-</template>
-
-<script>
-
-import { defineComponent } from 'vue'
-import QRCode from 'qrcode'
-
-export default defineComponent({
-	name: 'QrModal',
-
-	props: {
-		name: {
-			type: String,
-			default: '',
-		},
-		subTitle: {
-			type: String,
-			default: '',
-		},
-		description: {
-			type: String,
-			default: '',
-		},
-		encodeText: {
-			type: String,
-			default: '',
-		},
-	},
-
-	data() {
-		return {
-			qrUri: {
-				type: String,
-				default: '',
-			},
-		}
-	},
-
-	created() {
-		this.generateQr()
-	},
-
-	methods: {
-		async generateQr() {
-			try {
-				this.qrUri = await QRCode.toDataURL(this.encodeText)
-			} catch (err) {
-				console.error(err)
-			}
-		},
-	},
-})
-
-</script>
-
-<style lang="scss">
-.canvas {
-	margin: auto;
-	padding: 32px;
-}
-
-.qr-url {
-  font-size: 0.6em;
-  margin-top: 16px;
-}
-
-@media print {
-	.noprint {
-		display: none;
-	}
-}
-</style>
diff --git a/src/components/SidebarTabs/SharingSidebarTab.vue b/src/components/SidebarTabs/SharingSidebarTab.vue
index 576192c43..26a049fcd 100644
--- a/src/components/SidebarTabs/SharingSidebarTab.vue
+++ b/src/components/SidebarTabs/SharingSidebarTab.vue
@@ -21,7 +21,7 @@
   -
   -->
 
-<template>
+  <template>
 	<div class="sidebar-tabs__content">
 		<SharingSearchDiv :current-shares="form.shares"
 			:show-loading="isLoading"
@@ -98,12 +98,15 @@
 		</TransitionGroup>
 
 		<NcModal v-if="qrModal" size="small" @close="qrModal=false">
-			<QrModal :name="qrTitle"
-				:encodeText="qrText"
-				class="modal__content">
-				<template #description>
-				</template>
-			</QrModal>
+			<div class="qr-code modal__content">
+				<h2>{{ form.title }}</h2>
+				<div class="canvas">
+					<img :src="qrUri" :alt="qrText">
+				</div>
+				<p class="qr-url">
+					{{ qrText }}
+				</p>
+			</div>
 		</NcModal>
 
 		<!-- Legacy Info, if present -->
@@ -206,12 +209,12 @@ import IconDelete from 'vue-material-design-icons/Delete.vue'
 import IconLinkBoxVariantOutline from 'vue-material-design-icons/LinkBoxVariantOutline.vue'
 import IconLinkVariant from 'vue-material-design-icons/LinkVariant.vue'
 import IconPlus from 'vue-material-design-icons/Plus.vue'
+import QRCode from 'qrcode'
 
 import FormsIcon from '../Icons/FormsIcon.vue'
 import IconCopyAll from '../Icons/IconCopyAll.vue'
 import SharingSearchDiv from './SharingSearchDiv.vue'
 import SharingShareDiv from './SharingShareDiv.vue'
-import QrModal from '../QrModal.vue'
 import PermissionTypes from '../../mixins/PermissionTypes.js'
 import ShareTypes from '../../mixins/ShareTypes.js'
 import ShareLinkMixin from '../../mixins/ShareLinkMixin.js'
@@ -236,7 +239,6 @@ export default {
 		NcCheckboxRadioSwitch,
 		SharingSearchDiv,
 		SharingShareDiv,
-		QrModal,
 		NcModal,
 	},
 
@@ -255,7 +257,7 @@ export default {
 			appConfig: loadState(appName, 'appConfig'),
 			qrModal: false,
 			qrText: '',
-			qrTitle: '',
+			qrUri: '',
 		}
 	},
 
@@ -415,10 +417,14 @@ export default {
 			this.$emit('update:formProp', 'access', newAccess)
 		},
 
-		openQrModal(qrText) {
-			this.qrModal = true
-			this.qrTitle = this.form.title
+		async openQrModal(qrText) {
 			this.qrText = qrText
+			try {
+				this.qrUri = await QRCode.toDataURL(this.qrText)
+				this.qrModal = true
+			} catch (err) {
+				console.error(err)
+			}
 		},
 	},
 }
@@ -492,4 +498,12 @@ export default {
 	flex-direction: column;
 	color: var(--color-main-text);
 }
+
+.canvas {
+	margin: auto;
+}
+.qr-url {
+  font-size: 0.6em;
+  margin-top: 16px;
+}
 </style>