From 131cba88260be92230795740d2c08c6e5eea3d6e Mon Sep 17 00:00:00 2001
From: bsourisse <dev@r4ven.fr>
Date: Mon, 20 Mar 2023 11:40:21 +0100
Subject: [PATCH] ux: add link to doc for Apprise settings

---
 .../AppriseAlertSettings/AppriseAlertSettings.js     | 12 +++++++++++-
 Containers/UserSettings/UserSettings.module.css      |  1 +
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/Containers/UserSettings/AppriseAlertSettings/AppriseAlertSettings.js b/Containers/UserSettings/AppriseAlertSettings/AppriseAlertSettings.js
index e62a41f..356d4cf 100644
--- a/Containers/UserSettings/AppriseAlertSettings/AppriseAlertSettings.js
+++ b/Containers/UserSettings/AppriseAlertSettings/AppriseAlertSettings.js
@@ -5,6 +5,8 @@ import 'react-toastify/dist/ReactToastify.css';
 import classes from '../UserSettings.module.css';
 import { useState } from 'react';
 import { SpinnerCircularFixed } from 'spinners-react';
+import { IconExternalLink } from '@tabler/icons';
+import Link from 'next/link';
 
 //Components
 import Error from '../../../Components/UI/Error/Error';
@@ -147,7 +149,15 @@ export default function AppriseAlertSettings() {
             {/* APPRISE ALERT */}
             <div className={classes.containerSetting}>
                 <div className={classes.settingCategory}>
-                    <h2>Apprise alert</h2>
+                    <h2 style={{ alignSelf: 'baseline' }}>Apprise alert</h2>
+                    <Link
+                        style={{ alignSelf: 'baseline', marginLeft: '5px' }}
+                        href='https://borgwarehouse.com/docs/user-manual/account/#apprise'
+                        rel='noopener noreferrer'
+                        target='_blank'
+                    >
+                        <IconExternalLink size={16} color='#6c737f' />
+                    </Link>
                 </div>
                 <div className={classes.setting}>
                     <div className={classes.bwFormWrapper}>
diff --git a/Containers/UserSettings/UserSettings.module.css b/Containers/UserSettings/UserSettings.module.css
index 83f7a3d..6f9b393 100644
--- a/Containers/UserSettings/UserSettings.module.css
+++ b/Containers/UserSettings/UserSettings.module.css
@@ -34,6 +34,7 @@
 .settingCategory {
     max-width: 33.3333%;
     width: 100%;
+    display: flex;
 }
 .settingCategory h2 {
     color: #494b7a;