From ff0ee682292f322c346871900f66d6f05c127087 Mon Sep 17 00:00:00 2001
From: SimonGschnell <simongschnell@gmail.com>
Date: Fri, 17 Jan 2025 12:46:53 +0100
Subject: [PATCH] refactor(BookmarkWidget)

---
 .../controllers/api/frontend/v1/Bookmark.php  |  31 ++-
 public/js/api/bookmark.js                     |  10 +
 public/js/components/DashboardWidget/Url.js   | 179 +++++++++++++-----
 system/phrasesupdate.php                      |  60 ++++++
 4 files changed, 229 insertions(+), 51 deletions(-)

diff --git a/application/controllers/api/frontend/v1/Bookmark.php b/application/controllers/api/frontend/v1/Bookmark.php
index a811843ce..3e646bb51 100644
--- a/application/controllers/api/frontend/v1/Bookmark.php
+++ b/application/controllers/api/frontend/v1/Bookmark.php
@@ -30,6 +30,7 @@ class Bookmark extends FHCAPI_Controller
 			'getBookmarks' => self::PERM_LOGGED,
             'delete' => self::PERM_LOGGED,
             'insert' => self::PERM_LOGGED,
+			'update' => self::PERM_LOGGED,
         ]);
 
 		$this->load->model('dashboard/Bookmark_model', 'BookmarkModel');
@@ -50,7 +51,8 @@ class Bookmark extends FHCAPI_Controller
 	 */
 	public function getBookmarks()
 	{
-        $bookmarks = $this->BookmarkModel->loadWhere(["uid"=>$this->uid]);
+        $this->BookmarkModel->addOrder("bookmark_id");
+		$bookmarks = $this->BookmarkModel->loadWhere(["uid"=>$this->uid]);
 
         $bookmarks = $this->getDataOrTerminateWithError($bookmarks);
 
@@ -104,6 +106,33 @@ class Bookmark extends FHCAPI_Controller
 
         $this->terminateWithSuccess($insert_into_result);
 
+    }
+
+	/**
+	 * updates bookmark in the bookmark table 
+	 * @access public
+	 * @return void
+	 */
+    public function update($bookmark_id)
+	{
+        // form validation
+        $this->load->library('form_validation');
+        $this->form_validation->set_rules('url', 'URL', 'required|valid_url|max_length[511]');
+        $this->form_validation->set_rules('title', 'Title', 'required|max_length[255]');
+        if($this->form_validation->run() == FALSE) $this->terminateWithValidationErrors($this->form_validation->error_array());
+
+        $url = $this->input->post('url',true);
+        $title = $this->input->post('title',true);
+
+		$now = new DateTime();
+		$now = $now->format('Y-m-d H:i:s');
+
+        $update_result = $this->BookmarkModel->update($bookmark_id,['url'=>$url, 'title'=>$title,'updateamum'=>$now]);
+
+        $update_result = $this->getDataOrTerminateWithError($update_result);
+
+        $this->terminateWithSuccess($update_result);
+
     }
 }
 
diff --git a/public/js/api/bookmark.js b/public/js/api/bookmark.js
index 30e49d50d..5cef0a46b 100644
--- a/public/js/api/bookmark.js
+++ b/public/js/api/bookmark.js
@@ -14,6 +14,16 @@ export default {
       ); 
     },
 
+	update: function ({ bookmark_id, url, title, tag=null}) {
+		return this.$fhcApi.post(
+			`/api/frontend/v1/Bookmark/update/${bookmark_id}`
+			, {
+				url: url,
+				title: title
+			}
+		);
+	},
+
     insert: function ({url, title, tag}) {
       return this.$fhcApi.post(
         `/api/frontend/v1/Bookmark/insert`
diff --git a/public/js/components/DashboardWidget/Url.js b/public/js/components/DashboardWidget/Url.js
index 3a64dcc92..eaf42ab2d 100644
--- a/public/js/components/DashboardWidget/Url.js
+++ b/public/js/components/DashboardWidget/Url.js
@@ -1,3 +1,6 @@
+import CoreForm from "../Form/Form.js";
+import FormInput from "../Form/Input.js";
+import BsModal from "../Bootstrap/Modal.js";
 import AbstractWidget from './Abstract';
 
 export default {
@@ -9,13 +12,19 @@ export default {
 			default: false
 		}
 	},
+	components:{
+		CoreForm,
+		FormInput,
+		BsModal
+	},
 	data: () => ({
+		bookmark_id: null,
 		title_input: "",
 		url_input: "",
 		validation: {
 			invalidURL: false,
 			invalidTitel: false,
-		}
+		},
 	}),
 
 	computed: {
@@ -33,6 +42,74 @@ export default {
 		},
 	},
 	methods: {
+		stopDrag(event){
+			event.preventDefault();
+		},
+		clearInputs(){
+			this.title_input = "";
+			this.url_input = "";	
+		},
+		openCreateModal() {
+			this.$refs.createModal.show()
+		},
+		openEditModal(bookmark) {
+			this.title_input = bookmark.title;
+			this.url_input = bookmark.url;
+			this.bookmark_id = bookmark.bookmark_id;
+			this.$refs.editModal.show()
+		},
+		editBookmark(event){
+			event.preventDefault();
+			if(!this.bookmark_id || !this.url_input || !this.title_input) return;
+			
+			this.$fhcApi.factory.bookmark
+				.update({
+					bookmark_id: this.bookmark_id,
+					title: this.title_input,
+					url: this.url_input,
+				})
+				.then((res) => res.data)
+				.then((result) => {
+					this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkUpdated"));
+					// refetch the bookmarks to see the updates
+					this.fetchBookmarks();
+					// reset the values for the title and url inputs
+					this.clearInputs();
+					this.$refs.editModal.hide();
+					this.bookmark_id = null;
+				})
+				.catch(this.$fhcAlert.handleSystemError);
+		},
+
+		insertBookmark(event) {
+			event.preventDefault();
+
+			// reset is-invalid css on url input field
+			for (let key of Object.keys(this.validation)) {
+				this.validation[key] = false;
+			}
+
+			// early return if validation failed
+			if (!this.isValidationSuccessfull()) return;
+
+			this.$fhcApi.factory.bookmark
+				.insert({
+					tag: this.config.tag,
+					title: this.title_input,
+					url: this.url_input,
+				})
+				.then((res) => res.data)
+				.then((result) => {
+					this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkAdded"));
+					// refetch the bookmarks to see the updates
+					this.fetchBookmarks();
+					this.$refs.createModal.hide();
+					// reset the values for the title and url inputs
+					this.clearInputs();
+				})
+				.catch(this.$fhcAlert.handleSystemError);
+		},
+
 		isValidationSuccessfull() {
 			// validate the input fields
 			if (this.title_input.length === 0) {
@@ -55,33 +132,6 @@ export default {
 				})
 				.catch(this.$fhcAlert.handleSystemError);
 		},
-		addLink() {
-			// reset is-invalid css on url input field
-			for (let key of Object.keys(this.validation)) {
-				this.validation[key] = false;
-			}
-
-			// early return if validation failed
-			if (!this.isValidationSuccessfull()) return;
-
-			this.$fhcApi.factory.bookmark
-				.insert({
-					tag: this.config.tag,
-					title: this.title_input,
-					url: this.url_input,
-				})
-				.then((res) => res.data)
-				.then((result) => {
-					this.$fhcAlert.alertInfo(this.$p.t("bookmark", "bookmarkAdded"));
-					// refetch the bookmarks to see the updates
-					this.fetchBookmarks();
-				})
-				.catch(this.$fhcAlert.handleSystemError);
-
-			// reset the values for the title and url inputs
-			this.title_input = "";
-			this.url_input = "";
-		},
 		async removeLink(bookmark_id) {
 			let isConfirmed = await this.$fhcAlert.confirmDelete();
 
@@ -111,46 +161,75 @@ export default {
         <div class="d-flex flex-column justify-content-between">
         <!-- todo: widgetTag ?? -->
             <template v-if="shared">
+
                 <template v-if="!emptyBookmarks">
+					<button v-if="editModeIsActive" class="btn btn-outline-secondary btn-sm w-100 mt-2" @click="openCreateModal" type="button">{{$p.t('bookmark','newLink')}}</button>
 					<div v-for="link in shared" :key="link.id" class="d-flex mt-2">
 						<a target="_blank" :href="link.url">
 							<i class="fa fa-solid fa-arrow-up-right-from-square me-1"></i>{{ link.title }}
 						</a>
-						<a class="ms-auto" href="#" @click.prevent="removeLink(link.bookmark_id)" v-show="configMode || editModeIsActive">
-							<i class="fa fa-regular fa-trash-can" style="color: #e01b24;"></i>
-						</a>
+
+						<div class="ms-auto">
+							<!--EDIT BOOKMARK-->
+							<a href="#" @click.prevent="openEditModal(link)" v-show="configMode || editModeIsActive">
+								<i class="fa fa-edit me-1"></i>
+							</a>
+							<!--DELETE BOOKMARK-->
+							<a href="#" @click.prevent="removeLink(link.bookmark_id)" v-show="configMode || editModeIsActive">
+								<i class="fa fa-regular fa-trash-can" style="color: #e01b24;"></i>
+							</a>
+						</div>
 					</div>
                 </template>
+
                 <div v-else class="d-flex mt-2">
                     <span>{{$p.t('bookmark','emptyBookmarks')}}</span>
                 </div>
-                <div v-if="editModeIsActive " class="mt-2">
-                	<div class="form-group">
-						<input maxlength="255" required class="form-control form-control-sm" :class="{'is-invalid':validation.invalidTitel}" placeholder="Titel" type="text" v-model="title_input" name="title" >
-						<!-- validation html for titel -->
-						<div class="invalid-feedback">
-							{{$p.t("bookmark", "invalidTitel")}}.
-						</div>
-					</div>
 
-					<div class="form-group">
-						<input required id="bookmark_link" class="form-control form-control-sm mt-2" :class="{'is-invalid':validation.invalidURL}" type="url" placeholder="URL" v-model="url_input" name="url">
-						<!-- validation html for url -->
-						<div class="invalid-feedback">
-							{{$p.t("bookmark", "invalidUrl")}}.
-						</div>
-					</div>
-
-                    <button class="btn btn-outline-secondary btn-sm w-100 mt-2" @click="addLink" type="button">{{$p.t('bookmark','saveLink')}}</button>
-				</div>
             </template>
+
             <template v-else>
                 <p v-for="i in 4" class="placeholder-glow">
                     <span class="placeholder" :class="{'col-9' : true}"></span>
                 </p>
             </template>
         </div>
-    </div>`,
+    </div>
+	<!--EDIT MODAL-->
+	<core-form draggable="true" @dragstart="stopDrag" @drag="stopDrag" @dragend="stopDrag" v-if="editModeIsActive " ref="editForm">
+		<bs-modal @[\`hide.bs.modal\`]="bookmark_id=null; clearInputs();" ref="editModal">
+			<template #title>
+				<h2>{{$p.t('bookmark','editLink')}}</h2>
+			</template>
+			<template #default>
+				<label class="form-label" for="editTitle">Title</label>
+				<form-input id="editTitle" v-model="title_input" name="title" class="mb-2"></form-input>
+				<label class="form-label" for="editUrl">Url</label>
+				<form-input id="editUrl" v-model="url_input" name="url"></form-input>
+			</template>
+			<template #footer>
+				<button @click="editBookmark" class="btn btn-primary">{{$p.t('bookmark','editLink')}}</button>
+			</template>
+		</bs-modal>
+	</core-form>
+
+	<!--CREATE MODAL-->
+	<core-form draggable="true" @dragstart="stopDrag" @drag="stopDrag" @dragend="stopDrag" v-if="editModeIsActive " ref="createForm">
+		<bs-modal @[\`hide.bs.modal\`]="clearInputs();" ref="createModal">
+			<template #title>
+				<h2>{{$p.t('bookmark','newLink')}}</h2>
+			</template>
+			<template #default>
+				<label class="form-label" for="insertTitle">Title</label>
+				<form-input id="insertTitle" v-model="title_input" name="title" class="mb-2"></form-input>
+				<label class="form-label" for="insertUrl">Url</label>
+				<form-input id="insertUrl" v-model="url_input" name="url"></form-input>
+			</template>
+			<template #footer>
+				<button @click="insertBookmark" class="btn btn-primary">{{$p.t('bookmark','saveLink')}}</button>
+			</template>
+		</bs-modal>
+	</core-form>`,
 };
 
 /*
diff --git a/system/phrasesupdate.php b/system/phrasesupdate.php
index 58e974f8a..03a1259e6 100644
--- a/system/phrasesupdate.php
+++ b/system/phrasesupdate.php
@@ -31604,6 +31604,26 @@ array(
 			)
 		)
 	),
+	array(
+		'app' => 'core',
+		'category' => 'bookmark',
+		'phrase' => 'editLink',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Link bearbeiten',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Edit link',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
 	array(
 		'app' => 'core',
 		'category' => 'bookmark',
@@ -31643,6 +31663,46 @@ array(
 				'insertvon' => 'system'
 			)
 		)
+	)
+	,array(
+		'app' => 'core',
+		'category' => 'bookmark',
+		'phrase' => 'bookmarkAdded',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Link hinzugefügt',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Link added',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	)
+	,array(
+		'app' => 'core',
+		'category' => 'bookmark',
+		'phrase' => 'bookmarkUpdated',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Link geändert',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Link updated',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
 	),
 	array(
 		'app' => 'core',