rbs@u2-js

INSERT INTO `cp_filejs` (`id`,`app`,`path`,`modul`,`file_name`,`content`) VALUES ('618','1','u2/creator','profile','js/profile-edit.js---','import {\r\n deleteUserAccount,\r\n getSessionUser,\r\n updatePassword,\r\n updateUsername\r\n} from \\\\\\\\\\\\\\\"./api/auth.js\\\\\\\\\\\\\\\"\r\nimport {\r\n addUserProfileLinks,\r\n removeProfileLink,\r\n updateCoverImage,\r\n updateProfileImage,\r\n updateUserDetails,\r\n updateSocialLinks\r\n} from \\\\\\\\\\\\\\\"./api/profile.js\\\\\\\\\\\\\\\"\r\nimport app, {\r\n showToast\r\n} from \\\\\\\\\\\\\\\"./app.js\\\\\\\\\\\\\\\"\r\nimport store from \\\\\\\\\\\\\\\"./store.js\\\\\\\\\\\\\\\"\r\n\r\nvar $ = Dom7\r\n\r\n// --------------- Edit Profile Page ---------------\r\n$(document).on(\\\\\\\\\\\\\\\'page:init\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'.page[data-name=\\\\\\\\\\\\\\\"profile-edit-mydetails\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\', async function (e) {\r\n var view = app.views.current\r\n\r\n const user = await getSessionUser()\r\n\r\n if (!user) {\r\n view.router.navigate(\\\\\\\\\\\\\\\'/login\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n // Example of how to fill in the form fields with the provided data\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"email\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = user.email || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"first_name\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = user.first_name || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"last_name\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = user.last_name || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"tel_no\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = user.billing_info?.phone || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n})\r\n\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'#save-details\\\\\\\\\\\\\\\', async function () {\r\n var view = app.views.current\r\n\r\n const user = await getSessionUser()\r\n\r\n // Get the values from the input fields\r\n const firstName = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"first_name\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const lastName = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"last_name\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const email = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"email\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const telNo = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"tel_no\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const address = $(\\\\\\\\\\\\\\\'textarea[name=\\\\\\\\\\\\\\\"address\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const city = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"city\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const provincy = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"provincy\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const post_code = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"post_code\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n\r\n // Validate the input fields\r\n if (firstName === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n showToast(\\\\\\\\\\\\\\\'Please enter your first name\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (lastName === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n showToast(\\\\\\\\\\\\\\\'Please enter your last name\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (email === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n showToast(\\\\\\\\\\\\\\\'Please enter your email\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n // Simple email validation\r\n const emailPattern = /^[^s@]+@[^s@]+.[^s@]+$/;\r\n if (!emailPattern.test(email)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid email address\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n // // phone validation\r\n // if (telNo === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n // showToast(\\\\\\\\\\\\\\\'Please enter a valid phone number\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n // return\r\n // }\r\n\r\n // Prepare the data for the API request\r\n const requestData = {\r\n first_name: firstName,\r\n last_name: lastName,\r\n email: email,\r\n phone: telNo,\r\n address: address,\r\n city: city,\r\n provincy: provincy,\r\n post_code: post_code,\r\n };\r\n\r\n // check if the request data is the same as userdata\r\n let dirtied = false;\r\n\r\n for (const key in requestData) {\r\n if (key == \\\\\\\\\\\\\\\'phone\\\\\\\\\\\\\\\') {\r\n if (requestData[key] !== user.billing_info.phone) {\r\n dirtied = true\r\n break;\r\n }\r\n continue\r\n }\r\n\r\n if (requestData[key] !== user[key]) {\r\n dirtied = true\r\n break;\r\n }\r\n }\r\n\r\n if (!dirtied) {\r\n return\r\n }\r\n\r\n try {\r\n app.preloader.show()\r\n\r\n const response = await updateUserDetails(requestData, email !== user.email)\r\n\r\n app.preloader.hide()\r\n\r\n\r\n if (response && response.success) {\r\n // showToast(\\\\\\\\\\\\\\\'Details updated successfully\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Success\\\\\\\\\\\\\\\');\r\n showToast(\\\\\\\\\\\\\\\'Details updated successfully\\\\\\\\\\\\\\\')\r\n view.router.navigate(\\\\\\\\\\\\\\\'/profile/\\\\\\\\\\\\\\\')\r\n store.dispatch(\\\\\\\\\\\\\\\'updateUserDetails\\\\\\\\\\\\\\\')\r\n return;\r\n }\r\n\r\n throw new Error(response.message);\r\n } catch (error) {\r\n app.preloader.hide()\r\n app.notification.create({\r\n titleRightText: \\\\\\\\\\\\\\\'now\\\\\\\\\\\\\\\',\r\n subtitle: \\\\\\\\\\\\\\\'Oops, something went wrong\\\\\\\\\\\\\\\',\r\n text: error.message || \\\\\\\\\\\\\\\'Failed to update details\\\\\\\\\\\\\\\',\r\n }).open()\r\n }\r\n});\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'#update_password\\\\\\\\\\\\\\\', async function () {\r\n var view = app.views.current\r\n\r\n // Get the values from the password input fields\r\n const password = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"password\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const current_password = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"current_password\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n const confirmPassword = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"confirm_password\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val().trim();\r\n\r\n if (current_password === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n showToast(\\\\\\\\\\\\\\\'Please enter your current password\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return\r\n }\r\n\r\n if (password.length < 8) {\r\n showToast(\\\\\\\\\\\\\\\'Password must be at least 8 characters long.\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n // Check if password contains at least one lowercase letter\r\n if (!/[a-z]/.test(password)) {\r\n showToast(\\\\\\\\\\\\\\\'Password must contain at least one lowercase letter.\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n // Check if password contains at least one uppercase letter\r\n if (!/[A-Z]/.test(password)) {\r\n showToast(\\\\\\\\\\\\\\\'Password must contain at least one uppercase letter.\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n // Check if password contains at least one number\r\n if (!/d/.test(password)) {\r\n showToast(\\\\\\\\\\\\\\\'Password must contain at least one number.\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n if (confirmPassword === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n showToast(\\\\\\\\\\\\\\\'Please confirm your password\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (password !== confirmPassword) {\r\n showToast(\\\\\\\\\\\\\\\'Passwords do not match\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n try {\r\n app.preloader.show()\r\n\r\n const response = await updatePassword(password, current_password)\r\n\r\n app.preloader.hide()\r\n\r\n if (response && response.success) {\r\n showToast(\\\\\\\\\\\\\\\'Password updated successfully\\\\\\\\\\\\\\\')\r\n view.router.navigate(\\\\\\\\\\\\\\\'/profile/\\\\\\\\\\\\\\\')\r\n return;\r\n }\r\n\r\n throw new Error(response.message);\r\n } catch (error) {\r\n app.preloader.hide()\r\n app.notification.create({\r\n titleRightText: \\\\\\\\\\\\\\\'now\\\\\\\\\\\\\\\',\r\n subtitle: \\\\\\\\\\\\\\\'Oops, something went wrong\\\\\\\\\\\\\\\',\r\n text: error.message || \\\\\\\\\\\\\\\'Failed to update password\\\\\\\\\\\\\\\',\r\n }).open()\r\n }\r\n})\r\n// --------------- End Edit Profile Page ---------------\r\n\r\n\r\n// --------------- Edit Username Page ---------------\r\n$(document).on(\\\\\\\\\\\\\\\'page:beforein\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'.page[data-name=\\\\\\\\\\\\\\\"profile-edit-username\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\', async function (e) {\r\n var view = app.views.current\r\n\r\n const user = await getSessionUser()\r\n\r\n if (!user) {\r\n view.router.navigate(\\\\\\\\\\\\\\\'/login\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n\r\n // Example of how to fill in the form fields with the provided data\r\n $(\\\\\\\\\\\\\\\'.profile-edit-view input[name=\\\\\\\\\\\\\\\"username\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val(user.username || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\')\r\n\r\n if (user.can_update_username) {\r\n $(\\\\\\\\\\\\\\\'#username-editable\\\\\\\\\\\\\\\').remove()\r\n } else {\r\n document.querySelector(\\\\\\\\\\\\\\\'#username-editable\\\\\\\\\\\\\\\').innerText = `You can change your username in ${user.next_update_username} days`\r\n }\r\n})\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'#save-username\\\\\\\\\\\\\\\', async function () {\r\n var view = app.views.current\r\n\r\n const user = await getSessionUser()\r\n\r\n if (!user.can_update_username) {\r\n return\r\n }\r\n\r\n const username = $(\\\\\\\\\\\\\\\'.profile-edit-view input[name=\\\\\\\\\\\\\\\"username\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val()\r\n\r\n if (username === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a username\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n // username can only have letters, numbers, and underscores\r\n var usernamePattern = /^[a-zA-Z0-9_]+$/\r\n if (!usernamePattern.test(username)) {\r\n showToast(\\\\\\\\\\\\\\\'Username can only contain letters, numbers, and underscores\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n // username must be at least 3 characters long\r\n if (username.length < 3) {\r\n showToast(\\\\\\\\\\\\\\\'Username must be at least 3 characters long\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n if (username === user.username) {\r\n return\r\n }\r\n\r\n try {\r\n app.preloader.show()\r\n\r\n const response = await updateUsername(username)\r\n\r\n app.preloader.hide()\r\n\r\n if (response && response.success) {\r\n showToast(\\\\\\\\\\\\\\\'Username updated successfully\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Success\\\\\\\\\\\\\\\')\r\n view.router.navigate(\\\\\\\\\\\\\\\'/profile/\\\\\\\\\\\\\\\')\r\n\r\n store.dispatch(\\\\\\\\\\\\\\\'updateUserDetails\\\\\\\\\\\\\\\')\r\n } else {\r\n throw new Error(response.message)\r\n }\r\n } catch (error) {\r\n app.preloader.hide()\r\n app.notification.create({\r\n titleRightText: \\\\\\\\\\\\\\\'now\\\\\\\\\\\\\\\',\r\n subtitle: \\\\\\\\\\\\\\\'Oops, something went wrong\\\\\\\\\\\\\\\',\r\n text: error.message || \\\\\\\\\\\\\\\'Failed to update username\\\\\\\\\\\\\\\',\r\n }).open()\r\n }\r\n\r\n\r\n})\r\n// --------------- End Edit Username Page ---------------\r\n\r\n\r\n// --------------- Edit Profile images Page ---------------\r\n$(document).on(\\\\\\\\\\\\\\\'page:init\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'.page[data-name=\\\\\\\\\\\\\\\"profile-edit-images\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\', async function (e) {\r\n var view = app.views.current\r\n\r\n const user = await getSessionUser()\r\n\r\n if (!user) {\r\n view.router.navigate(\\\\\\\\\\\\\\\'/login\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n // If a cover photo exists, use it as the background image of the upload label\r\n if (user.cover_image) {\r\n $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"cover_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').closest(\\\\\\\\\\\\\\\'.custom-file-upload\\\\\\\\\\\\\\\').find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\').css(\\\\\\\\\\\\\\\'background-image\\\\\\\\\\\\\\\', `url(\\\\\\\\\\\\\\\'${user.cover_image}\\\\\\\\\\\\\\\')`)\r\n $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"cover_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').closest(\\\\\\\\\\\\\\\'.custom-file-upload\\\\\\\\\\\\\\\').find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\').css(\\\\\\\\\\\\\\\'background-size\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'cover\\\\\\\\\\\\\\\')\r\n }\r\n\r\n if (user.profile_image) {\r\n $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"profile_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').closest(\\\\\\\\\\\\\\\'.custom-file-upload\\\\\\\\\\\\\\\').find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\').css(\\\\\\\\\\\\\\\'background-image\\\\\\\\\\\\\\\', `url(\\\\\\\\\\\\\\\'${user.profile_image}\\\\\\\\\\\\\\\')`)\r\n $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"profile_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').closest(\\\\\\\\\\\\\\\'.custom-file-upload\\\\\\\\\\\\\\\').find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\').css(\\\\\\\\\\\\\\\'background-size\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'contain\\\\\\\\\\\\\\\')\r\n $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"profile_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').closest(\\\\\\\\\\\\\\\'.custom-file-upload\\\\\\\\\\\\\\\').find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\').css(\\\\\\\\\\\\\\\'background-position\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'center\\\\\\\\\\\\\\\')\r\n $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"profile_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').closest(\\\\\\\\\\\\\\\'.custom-file-upload\\\\\\\\\\\\\\\').find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\').css(\\\\\\\\\\\\\\\'background-repeat\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'no-repeat\\\\\\\\\\\\\\\')\r\n }\r\n})\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'#save-profile-images\\\\\\\\\\\\\\\', async function () {\r\n var view = app.views.current\r\n\r\n const cover_image = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"cover_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').prop(\\\\\\\\\\\\\\\'files\\\\\\\\\\\\\\\')[0]\r\n const profile_image = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"profile_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').prop(\\\\\\\\\\\\\\\'files\\\\\\\\\\\\\\\')[0]\r\n\r\n\r\n let coverBase64 = null\r\n let profileBase64 = null\r\n\r\n if (cover_image) {\r\n // Wrap the FileReader in a Promise to wait for it to complete\r\n coverBase64 = await new Promise((resolve, reject) => {\r\n const reader = new FileReader()\r\n reader.readAsDataURL(cover_image)\r\n\r\n reader.onload = () => resolve(reader.result)\r\n reader.onerror = () => reject(new Error(\\\\\\\\\\\\\\\'Failed to read image as base64\\\\\\\\\\\\\\\'))\r\n })\r\n }\r\n\r\n if (profile_image) {\r\n // Wrap the FileReader in a Promise to wait for it to complete\r\n profileBase64 = await new Promise((resolve, reject) => {\r\n const reader = new FileReader()\r\n reader.readAsDataURL(profile_image)\r\n\r\n reader.onload = () => resolve(reader.result)\r\n reader.onerror = () => reject(new Error(\\\\\\\\\\\\\\\'Failed to read image as base64\\\\\\\\\\\\\\\'))\r\n })\r\n }\r\n\r\n if (!coverBase64 && !profileBase64) {\r\n return\r\n }\r\n\r\n try {\r\n app.preloader.show()\r\n\r\n let promises = []\r\n\r\n if (profileBase64) {\r\n promises.push(updateProfileImage(profileBase64))\r\n }\r\n\r\n if (coverBase64) {\r\n promises.push(updateCoverImage(coverBase64))\r\n }\r\n\r\n const responses = await Promise.all(promises)\r\n app.preloader.hide()\r\n\r\n if (responses.every(response => response && response.success)) {\r\n showToast(\\\\\\\\\\\\\\\'Images updated successfully\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Success\\\\\\\\\\\\\\\')\r\n view.router.navigate(\\\\\\\\\\\\\\\'/profile/\\\\\\\\\\\\\\\')\r\n\r\n store.dispatch(\\\\\\\\\\\\\\\'updateUserDetails\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n if (responses.some(response => response && !response.success)) {\r\n throw new Error(\\\\\\\\\\\\\\\'Failed to update images\\\\\\\\\\\\\\\')\r\n }\r\n } catch (error) {\r\n app.preloader.hide()\r\n\r\n app.notification.create({\r\n titleRightText: \\\\\\\\\\\\\\\'now\\\\\\\\\\\\\\\',\r\n subtitle: \\\\\\\\\\\\\\\'Oops, something went wrong\\\\\\\\\\\\\\\',\r\n text: error.message || \\\\\\\\\\\\\\\'Failed to update images\\\\\\\\\\\\\\\',\r\n }).open()\r\n }\r\n})\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'change\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"cover_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\', function (e) {\r\n const file = e.target.files[0];\r\n const reader = new FileReader();\r\n\r\n reader.onload = function (event) {\r\n console.log($(\\\\\\\\\\\\\\\'.custom-file-upload.cover\\\\\\\\\\\\\\\'));\r\n\r\n $(\\\\\\\\\\\\\\\'.custom-file-upload.cover\\\\\\\\\\\\\\\')\r\n .find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\')\r\n .css(\\\\\\\\\\\\\\\'background-image\\\\\\\\\\\\\\\', `url(\\\\\\\\\\\\\\\'${event.target.result}\\\\\\\\\\\\\\\')`)\r\n .css(\\\\\\\\\\\\\\\'background-size\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'cover\\\\\\\\\\\\\\\');\r\n };\r\n\r\n if (file) {\r\n reader.readAsDataURL(file);\r\n }\r\n});\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'change\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"profile_image\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\', function (e) {\r\n const file = e.target.files[0];\r\n const reader = new FileReader();\r\n\r\n reader.onload = function (event) {\r\n console.log($(\\\\\\\\\\\\\\\'.custom-file-upload.profile\\\\\\\\\\\\\\\'));\r\n\r\n $(\\\\\\\\\\\\\\\'.custom-file-upload.profile\\\\\\\\\\\\\\\')\r\n .find(\\\\\\\\\\\\\\\'label\\\\\\\\\\\\\\\')\r\n .css(\\\\\\\\\\\\\\\'background-image\\\\\\\\\\\\\\\', `url(\\\\\\\\\\\\\\\'${event.target.result}\\\\\\\\\\\\\\\')`)\r\n .css(\\\\\\\\\\\\\\\'background-size\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'cover\\\\\\\\\\\\\\\');\r\n };\r\n\r\n if (file) {\r\n reader.readAsDataURL(file);\r\n }\r\n});\r\n// --------------- End Profile images Page ---------------\r\n\r\n\r\n// --------------- Edit Socials Page ---------------\r\n$(document).on(\\\\\\\\\\\\\\\'page:init\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'.page[data-name=\\\\\\\\\\\\\\\"profile-edit-socials\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\', async function (e) {\r\n var view = app.views.current\r\n\r\n const user = await getSessionUser()\r\n\r\n if (!user) {\r\n view.router.navigate(\\\\\\\\\\\\\\\'/login\\\\\\\\\\\\\\\')\r\n return\r\n }\r\n\r\n const externalLinks = user.profile_links || {};\r\n\r\n app.popup.create({\r\n el: \\\\\\\\\\\\\\\'.add-link-popup\\\\\\\\\\\\\\\',\r\n swipeToClose: \\\\\\\\\\\\\\\'to-bottom\\\\\\\\\\\\\\\'\r\n });\r\n\r\n // Populate form fields\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_instagram\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = externalLinks.instagram || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_facebook\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = externalLinks.facebook || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_tiktok\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = externalLinks.tiktok || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_youtube\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = externalLinks.youtube || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_mivia\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = externalLinks.mivia || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n document.querySelector(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_custodian\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').value = externalLinks.custodian || \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\';\r\n\r\n // .social-other-links ul\r\n const externalLinksContainer = $(\\\\\\\\\\\\\\\'.social-other-links ul\\\\\\\\\\\\\\\')[0];\r\n\r\n externalLinks.external_links?.forEach(linkObj => {\r\n const listItem = document.createElement(\\\\\\\\\\\\\\\'li\\\\\\\\\\\\\\\');\r\n\r\n\r\n listItem.innerHTML = `\r\n \r\n

\r\n \r\n `;\r\n externalLinksContainer.appendChild(listItem);\r\n });\r\n})\r\n\r\n// Add event listener for the Save button\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'#add-link-btn\\\\\\\\\\\\\\\', async function () {\r\n const linkTitle = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"custom_link_title\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n const linkUrl = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"custom_link_url\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n\r\n // Validate the inputs\r\n if (linkTitle === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n console.log(\\\\\\\\\\\\\\\'Please enter a link title.\\\\\\\\\\\\\\\', $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"custom_link_title\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\'));\r\n showToast(\\\\\\\\\\\\\\\'Please enter a link title.\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (linkUrl === \\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\') {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a link URL.\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n // Simple URL validation (basic check)\r\n // const urlPattern = /^(https?://)?([da-z.-]+).([a-z.]{2,6})([/w .-]*)*/?$/;\r\n // if (!urlPattern.test(linkUrl)) {\r\n // showToast(\\\\\\\\\\\\\\\'Please enter a valid URL.\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n // return;\r\n // }\r\n\r\n\r\n const urlPattern = /^(https?:\\\\\\\\\\\\\\\\/\\\\\\\\\\\\\\\\/|www\\\\\\\\\\\\\\\\.)[\\\\\\\\\\\\\\\\da-z\\\\\\\\\\\\\\\\.-]+\\\\\\\\\\\\\\\\.[a-z]{2,6}\\\\\\\\\\\\\\\\/?$/;\r\n if (!urlPattern.test(linkUrl)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid URL.\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n // Mock API request (POST request)\r\n const requestData = {\r\n label: linkTitle,\r\n url: linkUrl\r\n };\r\n\r\n app.popup.close()\r\n\r\n app.preloader.show()\r\n\r\n const response = await addUserProfileLinks({\r\n type: \\\\\\\\\\\\\\\'external_links\\\\\\\\\\\\\\\',\r\n link: requestData\r\n })\r\n\r\n if (response && response.success) {\r\n showToast(\\\\\\\\\\\\\\\'Link added successfully\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Success\\\\\\\\\\\\\\\');\r\n\r\n // Add the new link to the list\r\n const listItem = document.createElement(\\\\\\\\\\\\\\\'li\\\\\\\\\\\\\\\');\r\n listItem.innerHTML = `\r\n \r\n

\r\n

\r\n ${linkTitle}\r\n

\r\n

\r\n \r\n `;\r\n\r\n const externalLinksContainer = $(\\\\\\\\\\\\\\\'.social-other-links ul\\\\\\\\\\\\\\\')[0];\r\n externalLinksContainer.appendChild(listItem);\r\n store.dispatch(\\\\\\\\\\\\\\\'updateUserDetails\\\\\\\\\\\\\\\')\r\n }\r\n\r\n app.preloader.hide()\r\n});\r\n\r\n// Save social links\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'#save-profile-socials\\\\\\\\\\\\\\\', async function () {\r\n var view = app.views.current\r\n\r\n const user = await getSessionUser()\r\n\r\n const instagram = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_instagram\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n const facebook = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_facebook\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n const tiktok = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_tiktok\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n const youtube = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_youtube\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n const mivia = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_mivia\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n const custodian = $(\\\\\\\\\\\\\\\'input[name=\\\\\\\\\\\\\\\"social_custodian\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\').val();\r\n\r\n const links = {\r\n instagram,\r\n facebook,\r\n tiktok,\r\n youtube,\r\n mivia,\r\n custodian\r\n };\r\n\r\n // ig, tiktok, yt. mivia, custodian must be string, no special characters except for _ and - and . and\r\n const usernamePattern = /^[a-zA-Z0-9._-]+$/;\r\n\r\n if (instagram && !usernamePattern.test(instagram)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid Instagram username (letters, numbers, underscores, periods, hyphens only)\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (tiktok && !usernamePattern.test(tiktok)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid TikTok username (letters, numbers, underscores, periods, hyphens only)\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (youtube && !usernamePattern.test(youtube)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid YouTube username (letters, numbers, underscores, periods, hyphens only)\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (mivia && !usernamePattern.test(mivia)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid Mivia username (letters, numbers, underscores, periods, hyphens only)\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (custodian && !usernamePattern.test(custodian)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid Custodian username (letters, numbers, underscores, periods, hyphens only)\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n\r\n\r\n // facebook must be a valid facebook url\r\n const urlPattern = /^(https?:\\\\\\\\\\\\\\\\/\\\\\\\\\\\\\\\\/|www\\\\\\\\\\\\\\\\.)[\\\\\\\\\\\\\\\\da-z\\\\\\\\\\\\\\\\.-]+\\\\\\\\\\\\\\\\.[a-z]{2,6}\\\\\\\\\\\\\\\\/?$/;\r\n if (facebook && !usernamePattern.test(facebook)) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter a valid Facebook username (letters, numbers, underscores, periods, hyphens only)\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n // check if the request data is the same as userdata\r\n let dirtied = false;\r\n\r\n for (const key in links) {\r\n if (links[key] !== user.profile_links[key]) {\r\n dirtied = true\r\n break;\r\n }\r\n }\r\n\r\n if (!dirtied) {\r\n return\r\n }\r\n\r\n app.preloader.show()\r\n\r\n const response = await updateSocialLinks(links);\r\n\r\n app.preloader.hide()\r\n\r\n if (response && response.success) {\r\n showToast(\\\\\\\\\\\\\\\'Social links updated successfully\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Success\\\\\\\\\\\\\\\');\r\n view.router.navigate(\\\\\\\\\\\\\\\'/profile/\\\\\\\\\\\\\\\')\r\n store.dispatch(\\\\\\\\\\\\\\\'updateUserDetails\\\\\\\\\\\\\\\')\r\n } else {\r\n showToast(\\\\\\\\\\\\\\\'Failed to update social links\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n }\r\n})\r\n\r\n// Delete link\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'.delete-external-link\\\\\\\\\\\\\\\', async function (e) {\r\n const linkId = e.target.closest(\\\\\\\\\\\\\\\'.item-link\\\\\\\\\\\\\\\').dataset.linkId;\r\n\r\n // confirm dialog\r\n app.dialog.confirm(\\\\\\\\\\\\\\\'Are you sure you want to delete this link?\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Delete Link\\\\\\\\\\\\\\\', async function () {\r\n app.preloader.show()\r\n\r\n const response = await removeProfileLink(linkId);\r\n\r\n app.preloader.hide()\r\n\r\n if (response) {\r\n showToast(\\\\\\\\\\\\\\\'Link deleted successfully\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Success\\\\\\\\\\\\\\\')\r\n // remove the link from the list\r\n e.target.closest(\\\\\\\\\\\\\\\'.item-link\\\\\\\\\\\\\\\').remove();\r\n store.dispatch(\\\\\\\\\\\\\\\'updateUserDetails\\\\\\\\\\\\\\\')\r\n\r\n } else {\r\n showToast(\\\\\\\\\\\\\\\'Failed to delete link\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\')\r\n }\r\n })\r\n})\r\n// --------------- End Edit Socials Page ---------------\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'input\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'#lowercaseInput\\\\\\\\\\\\\\\', function (event) {\r\n this.value = this.value.toLowerCase();\r\n});\r\n\r\n// --------------- Delete Profile Page ---------------\r\n// $(document).on(\\\\\\\\\\\\\\\'page:init\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'.page[data-name=\\\\\\\\\\\\\\\"profile-edit-account-settings\\\\\\\\\\\\\\\"]\\\\\\\\\\\\\\\', function (e) {\r\n// });\r\n\r\n$(document).on(\\\\\\\\\\\\\\\'click\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'.account-delete\\\\\\\\\\\\\\\', function (e) {\r\n app.dialog.confirm(\\\\\\\\\\\\\\\'Are you sure? It is not possible to restore accounts once deleted.\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Confirm\\\\\\\\\\\\\\\', function (name) {\r\n app.dialog.passwordConfirm(\\\\\\\\\\\\\\\'Please enter your password.\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Delete Account\\\\\\\\\\\\\\\', async function (password) {\r\n await handleDeleteAccount(password);\r\n });\r\n });\r\n});\r\n\r\nasync function handleDeleteAccount(password) {\r\n\r\n try {\r\n app.preloader.show();\r\n\r\n const response = await deleteUserAccount(password);\r\n\r\n app.preloader.hide();\r\n if (!response) {\r\n app.dialog.alert(\\\\\\\\\\\\\\\'Failed to delete account\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (response && response.success == false) {\r\n app.dialog.alert(response.message, \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n\r\n if (response && response.success) {\r\n app.dialog.alert(\\\\\\\\\\\\\\\'Account deleted successfully\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Success\\\\\\\\\\\\\\\');\r\n\r\n setTimeout(() => {\r\n store.dispatch(\\\\\\\\\\\\\\\'logout\\\\\\\\\\\\\\\');\r\n }, 1000);\r\n }\r\n } catch (error) {\r\n app.preloader.hide();\r\n app.dialog.alert(error.message || \\\\\\\\\\\\\\\'Failed to delete account\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n }\r\n}\r\n\r\n// Custom dialog to ask for password\r\napp.dialog.passwordConfirm = function (text, title, callback) {\r\n app.dialog.create({\r\n title: title,\r\n text: text,\r\n content: \\\\\\\\\\\\\\\'

\\\\\\\\\\\\\\\',\r\n buttons: [{\r\n text: \\\\\\\\\\\\\\\'Cancel\\\\\\\\\\\\\\\',\r\n onClick: function (dialog, e) {\r\n dialog.close();\r\n }\r\n },\r\n {\r\n text: \\\\\\\\\\\\\\\'Delete\\\\\\\\\\\\\\\',\r\n bold: true,\r\n onClick: function (dialog, e) {\r\n var password = dialog.$el.find(\\\\\\\\\\\\\\\'.dialog-input\\\\\\\\\\\\\\\').val(); // Get the password entered\r\n if (!password) {\r\n showToast(\\\\\\\\\\\\\\\'Please enter your password\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\'Error\\\\\\\\\\\\\\\');\r\n return;\r\n }\r\n callback(password); // Pass the password to the callback\r\n dialog.close();\r\n }\r\n }\r\n ]\r\n }).open();\r\n};');

Save File Also

Copy This

modul

file_name function_name content 28285

import {
    deleteUserAccount,
    getSessionUser,
    updatePassword,
    updateUsername
} from \\\\\\\"./api/auth.js\\\\\\\"
import {
    addUserProfileLinks,
    removeProfileLink,
    updateCoverImage,
    updateProfileImage,
    updateUserDetails,
    updateSocialLinks
} from \\\\\\\"./api/profile.js\\\\\\\"
import app, {
    showToast
} from \\\\\\\"./app.js\\\\\\\"
import store from \\\\\\\"./store.js\\\\\\\"

var $ = Dom7

// --------------- Edit Profile Page ---------------
$(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-mydetails\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

const user = await getSessionUser()

if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }

// Example of how to fill in the form fields with the provided data
    document.querySelector(\\\\\\\'input[name=\\\\\\\"email\\\\\\\"]\\\\\\\').value = user.email || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"first_name\\\\\\\"]\\\\\\\').value = user.first_name || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"last_name\\\\\\\"]\\\\\\\').value = user.last_name || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"tel_no\\\\\\\"]\\\\\\\').value = user.billing_info?.phone || \\\\\\\'\\\\\\\';
})

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-details\\\\\\\', async function () {
    var view = app.views.current

const user = await getSessionUser()

// Get the values from the input fields
    const firstName = $(\\\\\\\'input[name=\\\\\\\"first_name\\\\\\\"]\\\\\\\').val().trim();
    const lastName = $(\\\\\\\'input[name=\\\\\\\"last_name\\\\\\\"]\\\\\\\').val().trim();
    const email = $(\\\\\\\'input[name=\\\\\\\"email\\\\\\\"]\\\\\\\').val().trim();
    const telNo = $(\\\\\\\'input[name=\\\\\\\"tel_no\\\\\\\"]\\\\\\\').val().trim();
    const address = $(\\\\\\\'textarea[name=\\\\\\\"address\\\\\\\"]\\\\\\\').val().trim();
    const city = $(\\\\\\\'input[name=\\\\\\\"city\\\\\\\"]\\\\\\\').val().trim();
    const provincy = $(\\\\\\\'input[name=\\\\\\\"provincy\\\\\\\"]\\\\\\\').val().trim();
    const post_code = $(\\\\\\\'input[name=\\\\\\\"post_code\\\\\\\"]\\\\\\\').val().trim();

// Validate the input fields
    if (firstName === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your first name\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (lastName === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your last name\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (email === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your email\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

// Simple email validation
    const emailPattern = /^[^s@]+@[^s@]+.[^s@]+$/;
    if (!emailPattern.test(email)) {
        showToast(\\\\\\\'Please enter a valid email address\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

// // phone validation
    // if (telNo === \\\\\\\'\\\\\\\') {
    //     showToast(\\\\\\\'Please enter a valid phone number\\\\\\\', \\\\\\\'Error\\\\\\\');
    //     return
    // }

// Prepare the data for the API request
    const requestData = {
        first_name: firstName,
        last_name: lastName,
        email: email,
        phone: telNo,
        address: address,
        city: city,
        provincy: provincy,
        post_code: post_code,
    };

// check if the request data is the same as userdata
    let dirtied = false;

for (const key in requestData) {
        if (key == \\\\\\\'phone\\\\\\\') {
            if (requestData[key] !== user.billing_info.phone) {
                dirtied = true
                break;
            }
            continue
        }

if (requestData[key] !== user[key]) {
            dirtied = true
            break;
        }
    }

if (!dirtied) {
        return
    }

try {
        app.preloader.show()

const response = await updateUserDetails(requestData, email !== user.email)

app.preloader.hide()

if (response && response.success) {
            // showToast(\\\\\\\'Details updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\');
            showToast(\\\\\\\'Details updated successfully\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')
            store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
            return;
        }

throw new Error(response.message);
    } catch (error) {
        app.preloader.hide()
        app.notification.create({
            titleRightText: \\\\\\\'now\\\\\\\',
            subtitle: \\\\\\\'Oops, something went wrong\\\\\\\',
            text: error.message || \\\\\\\'Failed to update details\\\\\\\',
        }).open()
    }
});

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#update_password\\\\\\\', async function () {
    var view = app.views.current

// Get the values from the password input fields
    const password = $(\\\\\\\'input[name=\\\\\\\"password\\\\\\\"]\\\\\\\').val().trim();
    const current_password = $(\\\\\\\'input[name=\\\\\\\"current_password\\\\\\\"]\\\\\\\').val().trim();
    const confirmPassword = $(\\\\\\\'input[name=\\\\\\\"confirm_password\\\\\\\"]\\\\\\\').val().trim();

if (current_password === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your current password\\\\\\\', \\\\\\\'Error\\\\\\\');
        return
    }

if (password.length < 8) {
        showToast(\\\\\\\'Password must be at least 8 characters long.\\\\\\\')
        return
    }

// Check if password contains at least one lowercase letter
    if (!/[a-z]/.test(password)) {
        showToast(\\\\\\\'Password must contain at least one lowercase letter.\\\\\\\')
        return
    }

// Check if password contains at least one uppercase letter
    if (!/[A-Z]/.test(password)) {
        showToast(\\\\\\\'Password must contain at least one uppercase letter.\\\\\\\')
        return
    }

// Check if password contains at least one number
    if (!/d/.test(password)) {
        showToast(\\\\\\\'Password must contain at least one number.\\\\\\\')
        return
    }

if (confirmPassword === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please confirm your password\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (password !== confirmPassword) {
        showToast(\\\\\\\'Passwords do not match\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

try {
        app.preloader.show()

const response = await updatePassword(password, current_password)

app.preloader.hide()

if (response && response.success) {
            showToast(\\\\\\\'Password updated successfully\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')
            return;
        }

// --------------- Edit Username Page ---------------
$(document).on(\\\\\\\'page:beforein\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-username\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

const user = await getSessionUser()

if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }

// Example of how to fill in the form fields with the provided data
    $(\\\\\\\'.profile-edit-view input[name=\\\\\\\"username\\\\\\\"]\\\\\\\').val(user.username || \\\\\\\'\\\\\\\')

if (user.can_update_username) {
        $(\\\\\\\'#username-editable\\\\\\\').remove()
    } else {
        document.querySelector(\\\\\\\'#username-editable\\\\\\\').innerText = `You can change your username in ${user.next_update_username} days`
    }
})

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-username\\\\\\\', async function () {
    var view = app.views.current

const user = await getSessionUser()

if (!user.can_update_username) {
        return
    }

const username = $(\\\\\\\'.profile-edit-view input[name=\\\\\\\"username\\\\\\\"]\\\\\\\').val()

if (username === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter a username\\\\\\\', \\\\\\\'Error\\\\\\\')
        return
    }

// username can only have letters, numbers, and underscores
    var usernamePattern = /^[a-zA-Z0-9_]+$/
    if (!usernamePattern.test(username)) {
        showToast(\\\\\\\'Username can only contain letters, numbers, and underscores\\\\\\\')
        return
    }

// username must be at least 3 characters long
    if (username.length < 3) {
        showToast(\\\\\\\'Username must be at least 3 characters long\\\\\\\')
        return
    }

if (username === user.username) {
        return
    }

try {
        app.preloader.show()

const response = await updateUsername(username)

app.preloader.hide()

if (response && response.success) {
            showToast(\\\\\\\'Username updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')

store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
        } else {
            throw new Error(response.message)
        }
    } catch (error) {
        app.preloader.hide()
        app.notification.create({
            titleRightText: \\\\\\\'now\\\\\\\',
            subtitle: \\\\\\\'Oops, something went wrong\\\\\\\',
            text: error.message || \\\\\\\'Failed to update username\\\\\\\',
        }).open()
    }

})
// --------------- End Edit Username Page ---------------

// --------------- Edit Profile images Page ---------------
$(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-images\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

const user = await getSessionUser()

if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }

// If a cover photo exists, use it as the background image of the upload label
    if (user.cover_image) {
        $(\\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${user.cover_image}\\\\\\\')`)
        $(\\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-size\\\\\\\', \\\\\\\'cover\\\\\\\')
    }

if (user.profile_image) {
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${user.profile_image}\\\\\\\')`)
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-size\\\\\\\', \\\\\\\'contain\\\\\\\')
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-position\\\\\\\', \\\\\\\'center\\\\\\\')
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-repeat\\\\\\\', \\\\\\\'no-repeat\\\\\\\')
    }
})

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-profile-images\\\\\\\', async function () {
    var view = app.views.current

const cover_image = $(\\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\').prop(\\\\\\\'files\\\\\\\')[0]
    const profile_image = $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').prop(\\\\\\\'files\\\\\\\')[0]

let coverBase64 = null
    let profileBase64 = null

if (cover_image) {
        // Wrap the FileReader in a Promise to wait for it to complete
        coverBase64 = await new Promise((resolve, reject) => {
            const reader = new FileReader()
            reader.readAsDataURL(cover_image)

reader.onload = () => resolve(reader.result)
            reader.onerror = () => reject(new Error(\\\\\\\'Failed to read image as base64\\\\\\\'))
        })
    }

if (profile_image) {
        // Wrap the FileReader in a Promise to wait for it to complete
        profileBase64 = await new Promise((resolve, reject) => {
            const reader = new FileReader()
            reader.readAsDataURL(profile_image)

reader.onload = () => resolve(reader.result)
            reader.onerror = () => reject(new Error(\\\\\\\'Failed to read image as base64\\\\\\\'))
        })
    }

if (!coverBase64 && !profileBase64) {
        return
    }

try {
        app.preloader.show()

let promises = []

if (profileBase64) {
            promises.push(updateProfileImage(profileBase64))
        }

if (coverBase64) {
            promises.push(updateCoverImage(coverBase64))
        }

const responses = await Promise.all(promises)
        app.preloader.hide()

if (responses.every(response => response && response.success)) {
            showToast(\\\\\\\'Images updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')

store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
            return
        }

if (responses.some(response => response && !response.success)) {
            throw new Error(\\\\\\\'Failed to update images\\\\\\\')
        }
    } catch (error) {
        app.preloader.hide()

app.notification.create({
            titleRightText: \\\\\\\'now\\\\\\\',
            subtitle: \\\\\\\'Oops, something went wrong\\\\\\\',
            text: error.message || \\\\\\\'Failed to update images\\\\\\\',
        }).open()
    }
})

$(document).on(\\\\\\\'change\\\\\\\', \\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\', function (e) {
    const file = e.target.files[0];
    const reader = new FileReader();

reader.onload = function (event) {
        console.log($(\\\\\\\'.custom-file-upload.cover\\\\\\\'));

$(\\\\\\\'.custom-file-upload.cover\\\\\\\')
            .find(\\\\\\\'label\\\\\\\')
            .css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${event.target.result}\\\\\\\')`)
            .css(\\\\\\\'background-size\\\\\\\', \\\\\\\'cover\\\\\\\');
    };

if (file) {
        reader.readAsDataURL(file);
    }
});

$(document).on(\\\\\\\'change\\\\\\\', \\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\', function (e) {
    const file = e.target.files[0];
    const reader = new FileReader();

reader.onload = function (event) {
        console.log($(\\\\\\\'.custom-file-upload.profile\\\\\\\'));

$(\\\\\\\'.custom-file-upload.profile\\\\\\\')
            .find(\\\\\\\'label\\\\\\\')
            .css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${event.target.result}\\\\\\\')`)
            .css(\\\\\\\'background-size\\\\\\\', \\\\\\\'cover\\\\\\\');
    };

if (file) {
        reader.readAsDataURL(file);
    }
});
// --------------- End Profile images Page ---------------

// --------------- Edit Socials Page ---------------
$(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-socials\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

const user = await getSessionUser()

if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }

const externalLinks = user.profile_links || {};

app.popup.create({
        el: \\\\\\\'.add-link-popup\\\\\\\',
        swipeToClose: \\\\\\\'to-bottom\\\\\\\'
    });

// Populate form fields
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_instagram\\\\\\\"]\\\\\\\').value = externalLinks.instagram || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_facebook\\\\\\\"]\\\\\\\').value = externalLinks.facebook || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_tiktok\\\\\\\"]\\\\\\\').value = externalLinks.tiktok || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_youtube\\\\\\\"]\\\\\\\').value = externalLinks.youtube || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_mivia\\\\\\\"]\\\\\\\').value = externalLinks.mivia || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_custodian\\\\\\\"]\\\\\\\').value = externalLinks.custodian || \\\\\\\'\\\\\\\';

// .social-other-links ul
    const externalLinksContainer = $(\\\\\\\'.social-other-links ul\\\\\\\')[0];

externalLinks.external_links?.forEach(linkObj => {
        const listItem = document.createElement(\\\\\\\'li\\\\\\\');

listItem.innerHTML = `
        <a class=\\\\\\\"item-link item-content\\\\\\\" href=\\\\\\\"${linkObj.link.url}\\\\\\\" data-link-id=\\\\\\\"${linkObj.id}\\\\\\\">
            <div class=\\\\\\\"item-inner\\\\\\\">
                <div class=\\\\\\\"item-title\\\\\\\">
                    ${linkObj.link.label}
                </div>
                <div class=\\\\\\\"item-after delete-external-link\\\\\\\"><i class=\\\\\\\"icon f7-icons\\\\\\\">xmark_circle</i></div>
            </div>
        </a>
        `;
        externalLinksContainer.appendChild(listItem);
    });
})

// Add event listener for the Save button
$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#add-link-btn\\\\\\\', async function () {
    const linkTitle = $(\\\\\\\'input[name=\\\\\\\"custom_link_title\\\\\\\"]\\\\\\\').val();
    const linkUrl = $(\\\\\\\'input[name=\\\\\\\"custom_link_url\\\\\\\"]\\\\\\\').val();

// Validate the inputs
    if (linkTitle === \\\\\\\'\\\\\\\') {
        console.log(\\\\\\\'Please enter a link title.\\\\\\\', $(\\\\\\\'input[name=\\\\\\\"custom_link_title\\\\\\\"]\\\\\\\'));
        showToast(\\\\\\\'Please enter a link title.\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (linkUrl === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter a link URL.\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

// Simple URL validation (basic check)
    // const urlPattern = /^(https?://)?([da-z.-]+).([a-z.]{2,6})([/w .-]*)*/?$/;
    // if (!urlPattern.test(linkUrl)) {
    //     showToast(\\\\\\\'Please enter a valid URL.\\\\\\\', \\\\\\\'Error\\\\\\\');
    //     return;
    // }

const urlPattern = /^(https?:\\\\\\\\/\\\\\\\\/|www\\\\\\\\.)[\\\\\\\\da-z\\\\\\\\.-]+\\\\\\\\.[a-z]{2,6}\\\\\\\\/?$/;
    if (!urlPattern.test(linkUrl)) {
        showToast(\\\\\\\'Please enter a valid URL.\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

// Mock API request (POST request)
    const requestData = {
        label: linkTitle,
        url: linkUrl
    };

app.popup.close()

app.preloader.show()

const response = await addUserProfileLinks({
        type: \\\\\\\'external_links\\\\\\\',
        link: requestData
    })

if (response && response.success) {
        showToast(\\\\\\\'Link added successfully\\\\\\\', \\\\\\\'Success\\\\\\\');

// Add the new link to the list
        const listItem = document.createElement(\\\\\\\'li\\\\\\\');
        listItem.innerHTML = `
            <a class=\\\\\\\"item-link item-content\\\\\\\" href=\\\\\\\"${linkUrl}\\\\\\\" data-link-id=\\\\\\\"${response.id}\\\\\\\">
                <div class=\\\\\\\"item-inner\\\\\\\">
                    <div class=\\\\\\\"item-title\\\\\\\">
                        ${linkTitle}
                    </div>
                    <div class=\\\\\\\"item-after\\\\\\\"><i class=\\\\\\\"icon f7-icons delete-external-link\\\\\\\">xmark_circle</i></div>
                </div>
            </a>
        `;

const externalLinksContainer = $(\\\\\\\'.social-other-links ul\\\\\\\')[0];
        externalLinksContainer.appendChild(listItem);
        store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
    }

app.preloader.hide()
});

// Save social links
$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-profile-socials\\\\\\\', async function () {
    var view = app.views.current

const user = await getSessionUser()

const instagram = $(\\\\\\\'input[name=\\\\\\\"social_instagram\\\\\\\"]\\\\\\\').val();
    const facebook = $(\\\\\\\'input[name=\\\\\\\"social_facebook\\\\\\\"]\\\\\\\').val();
    const tiktok = $(\\\\\\\'input[name=\\\\\\\"social_tiktok\\\\\\\"]\\\\\\\').val();
    const youtube = $(\\\\\\\'input[name=\\\\\\\"social_youtube\\\\\\\"]\\\\\\\').val();
    const mivia = $(\\\\\\\'input[name=\\\\\\\"social_mivia\\\\\\\"]\\\\\\\').val();
    const custodian = $(\\\\\\\'input[name=\\\\\\\"social_custodian\\\\\\\"]\\\\\\\').val();

const links = {
        instagram,
        facebook,
        tiktok,
        youtube,
        mivia,
        custodian
    };

// ig, tiktok, yt. mivia, custodian must be string, no special characters except for _ and - and . and
    const usernamePattern = /^[a-zA-Z0-9._-]+$/;

if (instagram && !usernamePattern.test(instagram)) {
        showToast(\\\\\\\'Please enter a valid Instagram username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (tiktok && !usernamePattern.test(tiktok)) {
        showToast(\\\\\\\'Please enter a valid TikTok username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (youtube && !usernamePattern.test(youtube)) {
        showToast(\\\\\\\'Please enter a valid YouTube username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (mivia && !usernamePattern.test(mivia)) {
        showToast(\\\\\\\'Please enter a valid Mivia username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

if (custodian && !usernamePattern.test(custodian)) {
        showToast(\\\\\\\'Please enter a valid Custodian username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

// facebook must be a valid facebook url
    const urlPattern = /^(https?:\\\\\\\\/\\\\\\\\/|www\\\\\\\\.)[\\\\\\\\da-z\\\\\\\\.-]+\\\\\\\\.[a-z]{2,6}\\\\\\\\/?$/;
    if (facebook && !usernamePattern.test(facebook)) {
        showToast(\\\\\\\'Please enter a valid Facebook username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

// check if the request data is the same as userdata
    let dirtied = false;

for (const key in links) {
        if (links[key] !== user.profile_links[key]) {
            dirtied = true
            break;
        }
    }

if (!dirtied) {
        return
    }

app.preloader.show()

const response = await updateSocialLinks(links);

app.preloader.hide()

if (response && response.success) {
        showToast(\\\\\\\'Social links updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\');
        view.router.navigate(\\\\\\\'/profile/\\\\\\\')
        store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
    } else {
        showToast(\\\\\\\'Failed to update social links\\\\\\\', \\\\\\\'Error\\\\\\\');
    }
})

// Delete link
$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'.delete-external-link\\\\\\\', async function (e) {
    const linkId = e.target.closest(\\\\\\\'.item-link\\\\\\\').dataset.linkId;

// confirm dialog
    app.dialog.confirm(\\\\\\\'Are you sure you want to delete this link?\\\\\\\', \\\\\\\'Delete Link\\\\\\\', async function () {
        app.preloader.show()

const response = await removeProfileLink(linkId);

app.preloader.hide()

if (response) {
            showToast(\\\\\\\'Link deleted successfully\\\\\\\', \\\\\\\'Success\\\\\\\')
            // remove the link from the list
            e.target.closest(\\\\\\\'.item-link\\\\\\\').remove();
            store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')

} else {
            showToast(\\\\\\\'Failed to delete link\\\\\\\', \\\\\\\'Error\\\\\\\')
        }
    })
})
// --------------- End Edit Socials Page ---------------

$(document).on(\\\\\\\'input\\\\\\\', \\\\\\\'#lowercaseInput\\\\\\\', function (event) {
    this.value = this.value.toLowerCase();
});

// --------------- Delete Profile Page ---------------
// $(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-account-settings\\\\\\\"]\\\\\\\', function (e) {
// });

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'.account-delete\\\\\\\', function (e) {
    app.dialog.confirm(\\\\\\\'Are you sure? It is not possible to restore accounts once deleted.\\\\\\\', \\\\\\\'Confirm\\\\\\\', function (name) {
        app.dialog.passwordConfirm(\\\\\\\'Please enter your password.\\\\\\\', \\\\\\\'Delete Account\\\\\\\', async function (password) {
            await handleDeleteAccount(password);
        });
    });
});

async function handleDeleteAccount(password) {

try {
        app.preloader.show();

const response = await deleteUserAccount(password);

app.preloader.hide();
        if (!response) {
            app.dialog.alert(\\\\\\\'Failed to delete account\\\\\\\', \\\\\\\'Error\\\\\\\');
            return;
        }

if (response && response.success == false) {
            app.dialog.alert(response.message, \\\\\\\'Error\\\\\\\');
            return;
        }

if (response && response.success) {
            app.dialog.alert(\\\\\\\'Account deleted successfully\\\\\\\', \\\\\\\'Success\\\\\\\');

setTimeout(() => {
                store.dispatch(\\\\\\\'logout\\\\\\\');
            }, 1000);
        }
    } catch (error) {
        app.preloader.hide();
        app.dialog.alert(error.message || \\\\\\\'Failed to delete account\\\\\\\', \\\\\\\'Error\\\\\\\');
    }
}

// Custom dialog to ask for password
app.dialog.passwordConfirm = function (text, title, callback) {
    app.dialog.create({
        title: title,
        text: text,
        content: \\\\\\\'<div class=\\\\\\\"dialog-input-field item-input\\\\\\\"><div class=\\\\\\\"item-input-wrap\\\\\\\"><input type=\\\\\\\"password\\\\\\\" name=\\\\\\\"password\\\\\\\" placeholder=\\\\\\\"Enter your password\\\\\\\" class=\\\\\\\"dialog-input\\\\\\\"></div></div>\\\\\\\',
        buttons: [{
                text: \\\\\\\'Cancel\\\\\\\',
                onClick: function (dialog, e) {
                    dialog.close();
                }
            },
            {
                text: \\\\\\\'Delete\\\\\\\',
                bold: true,
                onClick: function (dialog, e) {
                    var password = dialog.$el.find(\\\\\\\'.dialog-input\\\\\\\').val(); // Get the password entered
                    if (!password) {
                        showToast(\\\\\\\'Please enter your password\\\\\\\', \\\\\\\'Error\\\\\\\');
                        return;
                    }
                    callback(password); // Pass the password to the callback
                    dialog.close();
                }
            }
        ]
    }).open();
};

Warning: file_get_contents(/home/u340524018/domains/agniaga.com/public_html/sub/u2/creator/js/profile-edit.js---): Failed to open stream: No such file or directory in /home/u340524018/domains/agniaga.com/public_html/sub/u2/cp/inc.filejs.php on line 190
file content 0

import {
    deleteUserAccount,
    getSessionUser,
    updatePassword,
    updateUsername
} from \\\\\\\"./api/auth.js\\\\\\\"
import {
    addUserProfileLinks,
    removeProfileLink,
    updateCoverImage,
    updateProfileImage,
    updateUserDetails,
    updateSocialLinks
} from \\\\\\\"./api/profile.js\\\\\\\"
import app, {
    showToast
} from \\\\\\\"./app.js\\\\\\\"
import store from \\\\\\\"./store.js\\\\\\\"

var $ = Dom7

// --------------- Edit Profile Page ---------------
$(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-mydetails\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

    const user = await getSessionUser()

    if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }

    // Example of how to fill in the form fields with the provided data
    document.querySelector(\\\\\\\'input[name=\\\\\\\"email\\\\\\\"]\\\\\\\').value = user.email || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"first_name\\\\\\\"]\\\\\\\').value = user.first_name || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"last_name\\\\\\\"]\\\\\\\').value = user.last_name || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"tel_no\\\\\\\"]\\\\\\\').value = user.billing_info?.phone || \\\\\\\'\\\\\\\';
})


$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-details\\\\\\\', async function () {
    var view = app.views.current

    const user = await getSessionUser()

    // Get the values from the input fields
    const firstName = $(\\\\\\\'input[name=\\\\\\\"first_name\\\\\\\"]\\\\\\\').val().trim();
    const lastName = $(\\\\\\\'input[name=\\\\\\\"last_name\\\\\\\"]\\\\\\\').val().trim();
    const email = $(\\\\\\\'input[name=\\\\\\\"email\\\\\\\"]\\\\\\\').val().trim();
    const telNo = $(\\\\\\\'input[name=\\\\\\\"tel_no\\\\\\\"]\\\\\\\').val().trim();
    const address = $(\\\\\\\'textarea[name=\\\\\\\"address\\\\\\\"]\\\\\\\').val().trim();
    const city = $(\\\\\\\'input[name=\\\\\\\"city\\\\\\\"]\\\\\\\').val().trim();
    const provincy = $(\\\\\\\'input[name=\\\\\\\"provincy\\\\\\\"]\\\\\\\').val().trim();
    const post_code = $(\\\\\\\'input[name=\\\\\\\"post_code\\\\\\\"]\\\\\\\').val().trim();

    // Validate the input fields
    if (firstName === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your first name\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (lastName === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your last name\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (email === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your email\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    // Simple email validation
    const emailPattern = /^[^s@]+@[^s@]+.[^s@]+$/;
    if (!emailPattern.test(email)) {
        showToast(\\\\\\\'Please enter a valid email address\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    // // phone validation
    // if (telNo === \\\\\\\'\\\\\\\') {
    //     showToast(\\\\\\\'Please enter a valid phone number\\\\\\\', \\\\\\\'Error\\\\\\\');
    //     return
    // }

    // Prepare the data for the API request
    const requestData = {
        first_name: firstName,
        last_name: lastName,
        email: email,
        phone: telNo,
        address: address,
        city: city,
        provincy: provincy,
        post_code: post_code,
    };

    // check if the request data is the same as userdata
    let dirtied = false;

    for (const key in requestData) {
        if (key == \\\\\\\'phone\\\\\\\') {
            if (requestData[key] !== user.billing_info.phone) {
                dirtied = true
                break;
            }
            continue
        }

        if (requestData[key] !== user[key]) {
            dirtied = true
            break;
        }
    }

    if (!dirtied) {
        return
    }

    try {
        app.preloader.show()

        const response = await updateUserDetails(requestData, email !== user.email)

        app.preloader.hide()


        if (response && response.success) {
            // showToast(\\\\\\\'Details updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\');
            showToast(\\\\\\\'Details updated successfully\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')
            store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
            return;
        }

        throw new Error(response.message);
    } catch (error) {
        app.preloader.hide()
        app.notification.create({
            titleRightText: \\\\\\\'now\\\\\\\',
            subtitle: \\\\\\\'Oops, something went wrong\\\\\\\',
            text: error.message || \\\\\\\'Failed to update details\\\\\\\',
        }).open()
    }
});

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#update_password\\\\\\\', async function () {
    var view = app.views.current

    // Get the values from the password input fields
    const password = $(\\\\\\\'input[name=\\\\\\\"password\\\\\\\"]\\\\\\\').val().trim();
    const current_password = $(\\\\\\\'input[name=\\\\\\\"current_password\\\\\\\"]\\\\\\\').val().trim();
    const confirmPassword = $(\\\\\\\'input[name=\\\\\\\"confirm_password\\\\\\\"]\\\\\\\').val().trim();

    if (current_password === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter your current password\\\\\\\', \\\\\\\'Error\\\\\\\');
        return
    }

    if (password.length < 8) {
        showToast(\\\\\\\'Password must be at least 8 characters long.\\\\\\\')
        return
    }

    // Check if password contains at least one lowercase letter
    if (!/[a-z]/.test(password)) {
        showToast(\\\\\\\'Password must contain at least one lowercase letter.\\\\\\\')
        return
    }

    // Check if password contains at least one uppercase letter
    if (!/[A-Z]/.test(password)) {
        showToast(\\\\\\\'Password must contain at least one uppercase letter.\\\\\\\')
        return
    }

    // Check if password contains at least one number
    if (!/d/.test(password)) {
        showToast(\\\\\\\'Password must contain at least one number.\\\\\\\')
        return
    }

    if (confirmPassword === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please confirm your password\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (password !== confirmPassword) {
        showToast(\\\\\\\'Passwords do not match\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    try {
        app.preloader.show()

        const response = await updatePassword(password, current_password)

        app.preloader.hide()

        if (response && response.success) {
            showToast(\\\\\\\'Password updated successfully\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')
            return;
        }

        throw new Error(response.message);
    } catch (error) {
        app.preloader.hide()
        app.notification.create({
            titleRightText: \\\\\\\'now\\\\\\\',
            subtitle: \\\\\\\'Oops, something went wrong\\\\\\\',
            text: error.message || \\\\\\\'Failed to update password\\\\\\\',
        }).open()
    }
})
// --------------- End Edit Profile Page ---------------


// --------------- Edit Username Page ---------------
$(document).on(\\\\\\\'page:beforein\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-username\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

    const user = await getSessionUser()

    if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }


    // Example of how to fill in the form fields with the provided data
    $(\\\\\\\'.profile-edit-view input[name=\\\\\\\"username\\\\\\\"]\\\\\\\').val(user.username || \\\\\\\'\\\\\\\')

    if (user.can_update_username) {
        $(\\\\\\\'#username-editable\\\\\\\').remove()
    } else {
        document.querySelector(\\\\\\\'#username-editable\\\\\\\').innerText = `You can change your username in ${user.next_update_username} days`
    }
})

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-username\\\\\\\', async function () {
    var view = app.views.current

    const user = await getSessionUser()

    if (!user.can_update_username) {
        return
    }

    const username = $(\\\\\\\'.profile-edit-view input[name=\\\\\\\"username\\\\\\\"]\\\\\\\').val()

    if (username === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter a username\\\\\\\', \\\\\\\'Error\\\\\\\')
        return
    }

    // username can only have letters, numbers, and underscores
    var usernamePattern = /^[a-zA-Z0-9_]+$/
    if (!usernamePattern.test(username)) {
        showToast(\\\\\\\'Username can only contain letters, numbers, and underscores\\\\\\\')
        return
    }

    // username must be at least 3 characters long
    if (username.length < 3) {
        showToast(\\\\\\\'Username must be at least 3 characters long\\\\\\\')
        return
    }

    if (username === user.username) {
        return
    }

    try {
        app.preloader.show()

        const response = await updateUsername(username)

        app.preloader.hide()

        if (response && response.success) {
            showToast(\\\\\\\'Username updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')

            store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
        } else {
            throw new Error(response.message)
        }
    } catch (error) {
        app.preloader.hide()
        app.notification.create({
            titleRightText: \\\\\\\'now\\\\\\\',
            subtitle: \\\\\\\'Oops, something went wrong\\\\\\\',
            text: error.message || \\\\\\\'Failed to update username\\\\\\\',
        }).open()
    }


})
// --------------- End Edit Username Page ---------------


// --------------- Edit Profile images Page ---------------
$(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-images\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

    const user = await getSessionUser()

    if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }

    // If a cover photo exists, use it as the background image of the upload label
    if (user.cover_image) {
        $(\\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${user.cover_image}\\\\\\\')`)
        $(\\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-size\\\\\\\', \\\\\\\'cover\\\\\\\')
    }

    if (user.profile_image) {
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${user.profile_image}\\\\\\\')`)
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-size\\\\\\\', \\\\\\\'contain\\\\\\\')
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-position\\\\\\\', \\\\\\\'center\\\\\\\')
        $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').closest(\\\\\\\'.custom-file-upload\\\\\\\').find(\\\\\\\'label\\\\\\\').css(\\\\\\\'background-repeat\\\\\\\', \\\\\\\'no-repeat\\\\\\\')
    }
})

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-profile-images\\\\\\\', async function () {
    var view = app.views.current

    const cover_image = $(\\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\').prop(\\\\\\\'files\\\\\\\')[0]
    const profile_image = $(\\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\').prop(\\\\\\\'files\\\\\\\')[0]


    let coverBase64 = null
    let profileBase64 = null

    if (cover_image) {
        // Wrap the FileReader in a Promise to wait for it to complete
        coverBase64 = await new Promise((resolve, reject) => {
            const reader = new FileReader()
            reader.readAsDataURL(cover_image)

            reader.onload = () => resolve(reader.result)
            reader.onerror = () => reject(new Error(\\\\\\\'Failed to read image as base64\\\\\\\'))
        })
    }

    if (profile_image) {
        // Wrap the FileReader in a Promise to wait for it to complete
        profileBase64 = await new Promise((resolve, reject) => {
            const reader = new FileReader()
            reader.readAsDataURL(profile_image)

            reader.onload = () => resolve(reader.result)
            reader.onerror = () => reject(new Error(\\\\\\\'Failed to read image as base64\\\\\\\'))
        })
    }

    if (!coverBase64 && !profileBase64) {
        return
    }

    try {
        app.preloader.show()

        let promises = []

        if (profileBase64) {
            promises.push(updateProfileImage(profileBase64))
        }

        if (coverBase64) {
            promises.push(updateCoverImage(coverBase64))
        }

        const responses = await Promise.all(promises)
        app.preloader.hide()

        if (responses.every(response => response && response.success)) {
            showToast(\\\\\\\'Images updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\')
            view.router.navigate(\\\\\\\'/profile/\\\\\\\')

            store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
            return
        }

        if (responses.some(response => response && !response.success)) {
            throw new Error(\\\\\\\'Failed to update images\\\\\\\')
        }
    } catch (error) {
        app.preloader.hide()

        app.notification.create({
            titleRightText: \\\\\\\'now\\\\\\\',
            subtitle: \\\\\\\'Oops, something went wrong\\\\\\\',
            text: error.message || \\\\\\\'Failed to update images\\\\\\\',
        }).open()
    }
})

$(document).on(\\\\\\\'change\\\\\\\', \\\\\\\'input[name=\\\\\\\"cover_image\\\\\\\"]\\\\\\\', function (e) {
    const file = e.target.files[0];
    const reader = new FileReader();

    reader.onload = function (event) {
        console.log($(\\\\\\\'.custom-file-upload.cover\\\\\\\'));

        $(\\\\\\\'.custom-file-upload.cover\\\\\\\')
            .find(\\\\\\\'label\\\\\\\')
            .css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${event.target.result}\\\\\\\')`)
            .css(\\\\\\\'background-size\\\\\\\', \\\\\\\'cover\\\\\\\');
    };

    if (file) {
        reader.readAsDataURL(file);
    }
});

$(document).on(\\\\\\\'change\\\\\\\', \\\\\\\'input[name=\\\\\\\"profile_image\\\\\\\"]\\\\\\\', function (e) {
    const file = e.target.files[0];
    const reader = new FileReader();

    reader.onload = function (event) {
        console.log($(\\\\\\\'.custom-file-upload.profile\\\\\\\'));

        $(\\\\\\\'.custom-file-upload.profile\\\\\\\')
            .find(\\\\\\\'label\\\\\\\')
            .css(\\\\\\\'background-image\\\\\\\', `url(\\\\\\\'${event.target.result}\\\\\\\')`)
            .css(\\\\\\\'background-size\\\\\\\', \\\\\\\'cover\\\\\\\');
    };

    if (file) {
        reader.readAsDataURL(file);
    }
});
// --------------- End Profile images Page ---------------


// --------------- Edit Socials Page ---------------
$(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-socials\\\\\\\"]\\\\\\\', async function (e) {
    var view = app.views.current

    const user = await getSessionUser()

    if (!user) {
        view.router.navigate(\\\\\\\'/login\\\\\\\')
        return
    }

    const externalLinks = user.profile_links || {};

    app.popup.create({
        el: \\\\\\\'.add-link-popup\\\\\\\',
        swipeToClose: \\\\\\\'to-bottom\\\\\\\'
    });

    // Populate form fields
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_instagram\\\\\\\"]\\\\\\\').value = externalLinks.instagram || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_facebook\\\\\\\"]\\\\\\\').value = externalLinks.facebook || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_tiktok\\\\\\\"]\\\\\\\').value = externalLinks.tiktok || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_youtube\\\\\\\"]\\\\\\\').value = externalLinks.youtube || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_mivia\\\\\\\"]\\\\\\\').value = externalLinks.mivia || \\\\\\\'\\\\\\\';
    document.querySelector(\\\\\\\'input[name=\\\\\\\"social_custodian\\\\\\\"]\\\\\\\').value = externalLinks.custodian || \\\\\\\'\\\\\\\';

    // .social-other-links ul
    const externalLinksContainer = $(\\\\\\\'.social-other-links ul\\\\\\\')[0];

    externalLinks.external_links?.forEach(linkObj => {
        const listItem = document.createElement(\\\\\\\'li\\\\\\\');


        listItem.innerHTML = `
        <a class=\\\\\\\"item-link item-content\\\\\\\" href=\\\\\\\"${linkObj.link.url}\\\\\\\" data-link-id=\\\\\\\"${linkObj.id}\\\\\\\">
            <div class=\\\\\\\"item-inner\\\\\\\">
                <div class=\\\\\\\"item-title\\\\\\\">
                    ${linkObj.link.label}
                </div>
                <div class=\\\\\\\"item-after delete-external-link\\\\\\\"><i class=\\\\\\\"icon f7-icons\\\\\\\">xmark_circle</i></div>
            </div>
        </a>
        `;
        externalLinksContainer.appendChild(listItem);
    });
})

// Add event listener for the Save button
$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#add-link-btn\\\\\\\', async function () {
    const linkTitle = $(\\\\\\\'input[name=\\\\\\\"custom_link_title\\\\\\\"]\\\\\\\').val();
    const linkUrl = $(\\\\\\\'input[name=\\\\\\\"custom_link_url\\\\\\\"]\\\\\\\').val();

    // Validate the inputs
    if (linkTitle === \\\\\\\'\\\\\\\') {
        console.log(\\\\\\\'Please enter a link title.\\\\\\\', $(\\\\\\\'input[name=\\\\\\\"custom_link_title\\\\\\\"]\\\\\\\'));
        showToast(\\\\\\\'Please enter a link title.\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (linkUrl === \\\\\\\'\\\\\\\') {
        showToast(\\\\\\\'Please enter a link URL.\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    // Simple URL validation (basic check)
    // const urlPattern = /^(https?://)?([da-z.-]+).([a-z.]{2,6})([/w .-]*)*/?$/;
    // if (!urlPattern.test(linkUrl)) {
    //     showToast(\\\\\\\'Please enter a valid URL.\\\\\\\', \\\\\\\'Error\\\\\\\');
    //     return;
    // }


    const urlPattern = /^(https?:\\\\\\\\/\\\\\\\\/|www\\\\\\\\.)[\\\\\\\\da-z\\\\\\\\.-]+\\\\\\\\.[a-z]{2,6}\\\\\\\\/?$/;
    if (!urlPattern.test(linkUrl)) {
        showToast(\\\\\\\'Please enter a valid URL.\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    // Mock API request (POST request)
    const requestData = {
        label: linkTitle,
        url: linkUrl
    };

    app.popup.close()

    app.preloader.show()

    const response = await addUserProfileLinks({
        type: \\\\\\\'external_links\\\\\\\',
        link: requestData
    })

    if (response && response.success) {
        showToast(\\\\\\\'Link added successfully\\\\\\\', \\\\\\\'Success\\\\\\\');

        // Add the new link to the list
        const listItem = document.createElement(\\\\\\\'li\\\\\\\');
        listItem.innerHTML = `
            <a class=\\\\\\\"item-link item-content\\\\\\\" href=\\\\\\\"${linkUrl}\\\\\\\" data-link-id=\\\\\\\"${response.id}\\\\\\\">
                <div class=\\\\\\\"item-inner\\\\\\\">
                    <div class=\\\\\\\"item-title\\\\\\\">
                        ${linkTitle}
                    </div>
                    <div class=\\\\\\\"item-after\\\\\\\"><i class=\\\\\\\"icon f7-icons delete-external-link\\\\\\\">xmark_circle</i></div>
                </div>
            </a>
        `;

        const externalLinksContainer = $(\\\\\\\'.social-other-links ul\\\\\\\')[0];
        externalLinksContainer.appendChild(listItem);
        store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
    }

    app.preloader.hide()
});

// Save social links
$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'#save-profile-socials\\\\\\\', async function () {
    var view = app.views.current

    const user = await getSessionUser()

    const instagram = $(\\\\\\\'input[name=\\\\\\\"social_instagram\\\\\\\"]\\\\\\\').val();
    const facebook = $(\\\\\\\'input[name=\\\\\\\"social_facebook\\\\\\\"]\\\\\\\').val();
    const tiktok = $(\\\\\\\'input[name=\\\\\\\"social_tiktok\\\\\\\"]\\\\\\\').val();
    const youtube = $(\\\\\\\'input[name=\\\\\\\"social_youtube\\\\\\\"]\\\\\\\').val();
    const mivia = $(\\\\\\\'input[name=\\\\\\\"social_mivia\\\\\\\"]\\\\\\\').val();
    const custodian = $(\\\\\\\'input[name=\\\\\\\"social_custodian\\\\\\\"]\\\\\\\').val();

    const links = {
        instagram,
        facebook,
        tiktok,
        youtube,
        mivia,
        custodian
    };

    // ig, tiktok, yt. mivia, custodian must be string, no special characters except for _ and - and . and
    const usernamePattern = /^[a-zA-Z0-9._-]+$/;

    if (instagram && !usernamePattern.test(instagram)) {
        showToast(\\\\\\\'Please enter a valid Instagram username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (tiktok && !usernamePattern.test(tiktok)) {
        showToast(\\\\\\\'Please enter a valid TikTok username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (youtube && !usernamePattern.test(youtube)) {
        showToast(\\\\\\\'Please enter a valid YouTube username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (mivia && !usernamePattern.test(mivia)) {
        showToast(\\\\\\\'Please enter a valid Mivia username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    if (custodian && !usernamePattern.test(custodian)) {
        showToast(\\\\\\\'Please enter a valid Custodian username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }



    // facebook must be a valid facebook url
    const urlPattern = /^(https?:\\\\\\\\/\\\\\\\\/|www\\\\\\\\.)[\\\\\\\\da-z\\\\\\\\.-]+\\\\\\\\.[a-z]{2,6}\\\\\\\\/?$/;
    if (facebook && !usernamePattern.test(facebook)) {
        showToast(\\\\\\\'Please enter a valid Facebook username (letters, numbers, underscores, periods, hyphens only)\\\\\\\', \\\\\\\'Error\\\\\\\');
        return;
    }

    // check if the request data is the same as userdata
    let dirtied = false;

    for (const key in links) {
        if (links[key] !== user.profile_links[key]) {
            dirtied = true
            break;
        }
    }

    if (!dirtied) {
        return
    }

    app.preloader.show()

    const response = await updateSocialLinks(links);

    app.preloader.hide()

    if (response && response.success) {
        showToast(\\\\\\\'Social links updated successfully\\\\\\\', \\\\\\\'Success\\\\\\\');
        view.router.navigate(\\\\\\\'/profile/\\\\\\\')
        store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')
    } else {
        showToast(\\\\\\\'Failed to update social links\\\\\\\', \\\\\\\'Error\\\\\\\');
    }
})

// Delete link
$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'.delete-external-link\\\\\\\', async function (e) {
    const linkId = e.target.closest(\\\\\\\'.item-link\\\\\\\').dataset.linkId;

    // confirm dialog
    app.dialog.confirm(\\\\\\\'Are you sure you want to delete this link?\\\\\\\', \\\\\\\'Delete Link\\\\\\\', async function () {
        app.preloader.show()

        const response = await removeProfileLink(linkId);

        app.preloader.hide()

        if (response) {
            showToast(\\\\\\\'Link deleted successfully\\\\\\\', \\\\\\\'Success\\\\\\\')
            // remove the link from the list
            e.target.closest(\\\\\\\'.item-link\\\\\\\').remove();
            store.dispatch(\\\\\\\'updateUserDetails\\\\\\\')

        } else {
            showToast(\\\\\\\'Failed to delete link\\\\\\\', \\\\\\\'Error\\\\\\\')
        }
    })
})
// --------------- End Edit Socials Page ---------------

$(document).on(\\\\\\\'input\\\\\\\', \\\\\\\'#lowercaseInput\\\\\\\', function (event) {
    this.value = this.value.toLowerCase();
});

// --------------- Delete Profile Page ---------------
// $(document).on(\\\\\\\'page:init\\\\\\\', \\\\\\\'.page[data-name=\\\\\\\"profile-edit-account-settings\\\\\\\"]\\\\\\\', function (e) {
// });

$(document).on(\\\\\\\'click\\\\\\\', \\\\\\\'.account-delete\\\\\\\', function (e) {
    app.dialog.confirm(\\\\\\\'Are you sure? It is not possible to restore accounts once deleted.\\\\\\\', \\\\\\\'Confirm\\\\\\\', function (name) {
        app.dialog.passwordConfirm(\\\\\\\'Please enter your password.\\\\\\\', \\\\\\\'Delete Account\\\\\\\', async function (password) {
            await handleDeleteAccount(password);
        });
    });
});

async function handleDeleteAccount(password) {

    try {
        app.preloader.show();

        const response = await deleteUserAccount(password);

        app.preloader.hide();
        if (!response) {
            app.dialog.alert(\\\\\\\'Failed to delete account\\\\\\\', \\\\\\\'Error\\\\\\\');
            return;
        }

        if (response && response.success == false) {
            app.dialog.alert(response.message, \\\\\\\'Error\\\\\\\');
            return;
        }

        if (response && response.success) {
            app.dialog.alert(\\\\\\\'Account deleted successfully\\\\\\\', \\\\\\\'Success\\\\\\\');

            setTimeout(() => {
                store.dispatch(\\\\\\\'logout\\\\\\\');
            }, 1000);
        }
    } catch (error) {
        app.preloader.hide();
        app.dialog.alert(error.message || \\\\\\\'Failed to delete account\\\\\\\', \\\\\\\'Error\\\\\\\');
    }
}

// Custom dialog to ask for password
app.dialog.passwordConfirm = function (text, title, callback) {
    app.dialog.create({
        title: title,
        text: text,
        content: \\\\\\\'<div class=\\\\\\\"dialog-input-field item-input\\\\\\\"><div class=\\\\\\\"item-input-wrap\\\\\\\"><input type=\\\\\\\"password\\\\\\\" name=\\\\\\\"password\\\\\\\" placeholder=\\\\\\\"Enter your password\\\\\\\" class=\\\\\\\"dialog-input\\\\\\\"></div></div>\\\\\\\',
        buttons: [{
                text: \\\\\\\'Cancel\\\\\\\',
                onClick: function (dialog, e) {
                    dialog.close();
                }
            },
            {
                text: \\\\\\\'Delete\\\\\\\',
                bold: true,
                onClick: function (dialog, e) {
                    var password = dialog.$el.find(\\\\\\\'.dialog-input\\\\\\\').val(); // Get the password entered
                    if (!password) {
                        showToast(\\\\\\\'Please enter your password\\\\\\\', \\\\\\\'Error\\\\\\\');
                        return;
                    }
                    callback(password); // Pass the password to the callback
                    dialog.close();
                }
            }
        ]
    }).open();
};

Add JS Function Name

profile
js/profile-edit.js---

js/view-user-profile.js-

js/view-user-profile.js--

js/view-user-profile.js---

js/view-user-profile.js----

js/profile.js-

js/profile-edit.js-

js/profile-edit.js--

js/profile-edit.js

js/profile.js

js/view-user-profile.js