add ChemLocalLink documentation (#370)

* docs: add chemlocallink user documentation

* suggested changes

* fix case for image filenames

---------

Authored-by: mekkyz <[email protected]>

docs/services/chemlocallink/index.mdx

@@ -0,0 +1,30 @@
+---
+title: ChemLocalLink
+sidebar_position: 5
+---
+
+:::info
+ChemLocalLink documentation is still being reviewed.  
+:::
+
+:::info[Important Notice]
+Currently, only the Windows version is released, though the app is cross-platform.  
+Linux (Debian-based) version is in internal testing and requires manual installation.  
+Linux users interested in testing can contact the [developer](mailto:[email protected]).
+:::
+
+ChemLocalLink is a cross-platform desktop-based software, designed to handle opening all ELN files locally, keeping them in one place for easier editing, opening, and uploading them back if needed.  
+It is essentially a one-click-to-edit tool -> click on the link, open with desktop app, edit and upload again.
+
+**Key Features:**
+
+- **URL Handling**: Handles chemotion-specific URLs to react with Chemotion.
+- **History**: Maintains a list of downloaded Files for easy access and management.
+- **File Handling**: Allows users to download Chemotion-related files, modify them, and then upload back
+- **Notifications**: Integrated system tray and app window notifications to alert users about the status of their tasks.
+
+The user interface of ChemLocalLink is shown here:
+
+![UI-ChemLocalLink](/img/chemlocallink/img1.png)
+
+Please go to the different sub-pages under ChemLocalLink to get insight on how to install and use this application.

docs/services/chemlocallink/installation.mdx

@@ -0,0 +1,78 @@
+---
+title: Installation
+sidebar_position: 1
+---
+
+:::info[Supported OS]
+
+Currently only Windows is supported. Please check the previous page for more insight.
+
+:::
+
+1. **Download the latest release** from the [release page](https://github.com/Chemotion/chemlocallink/releases/latest).
+
+2. **Open the executable file**: ChemLocalLink-Setup-[V].exe
+
+3. **Go through the installation wizard**:
+
+   A. **License Agreement**  
+    Please read the license agreement carefully and click on **I accept the agreement**
+   ![UI-Ins1](/img/chemlocallink/img2.png)
+
+   B. **Select Destination Folder**  
+    Please choose a destination folder for installing the application. The default directory is set to:  
+    `C:\Program Files\ChemLocalLink`.
+
+   {" "}
+
+   <div
+     style={{
+       display: "flex",
+       alignItems: "center",
+       padding: "8px",
+       fontSize: "15px",
+       boxShadow: "0 2px 5px rgba(0, 0, 0, 0.1)",
+       backgroundColor: "#f5f7fa",
+       borderLeft: "4px solid #007acc",
+       borderRadius: "5px",
+     }}
+   >
+     <strong style={{ marginRight: "10px", color: "#007acc" }}>Notice:</strong>
+     <span>We recommend leaving the Destination folder as it is.</span>
+   </div>
+   ![UI-Ins2](/img/chemlocallink/img3.png)
+
+   C. **Select Start Menu Folder**  
+    Please select the Start Menu folder where shortcuts will be created. The default group name is set to `ChemLocalLink`.
+
+   {" "}
+
+   <div
+     style={{
+       display: "flex",
+       alignItems: "center",
+       padding: "8px",
+       fontSize: "15px",
+       boxShadow: "0 2px 5px rgba(0, 0, 0, 0.1)",
+       backgroundColor: "#f5f7fa",
+       borderLeft: "4px solid #007acc",
+       borderRadius: "5px",
+     }}
+   >
+     <strong style={{ marginRight: "10px", color: "#007acc" }}>Notice:</strong>
+     <span>We recommend leaving the Start Menu folder as it is.</span>
+   </div>
+   ![UI-Ins3](/img/chemlocallink/img4.png)
+
+   D. **Overview**  
+    The wizard will show you both the Destination Folder and the Start Menu folder before installing. If everything thing is okay, please click on **Install**  
+    ![UI-Ins4](/img/chemlocallink/img5.png)
+
+   E. **DotNet 8.0 Dependency Check**  
+    The installer will check for the specific version of the .NET Desktop Runtime (8.0.6) as a dependency.  
+    If not present, it will install it for you.
+
+4. **ChemLocalLink is now installed!**  
+   Now you can open files from the Chemotion ELN or open the application directly from the Start Menu.
+
+Go to the next page to get insight on how to use it.

docs/services/chemlocallink/interaction.mdx

@@ -0,0 +1,27 @@
+---
+title: Interaction with ELN
+sidebar_position: 2
+---
+
+## Overview
+
+ChemLocalLink listens for a specific URL pattern to open files from Chemotion. For example, URLs may look like this `chemotion://FILEURL`  
+This URL automatically triggers **ChemLocalLink** to start the download process when clicked.
+
+## Usage with ChemLocalLink
+
+### 1. Get an ELN version that supports Third-Party-Apps
+
+To use ChemLocalLink, ensure you are working with an ELN version that supports third-party applications.
+
+:::info  
+It can be tested using the [Uncharted Instance](https://uncharted.chemotion.ibcs.kit.edu/). This instance supports **Third-Party Apps**.  
+:::
+
+### 2. Open Files from Attachment Lists in Chemotion ELN
+
+From the attachment list, select the **Open locally** option from the download drop-down menu.
+
+![UI-OpenLocally](/img/chemlocallink/openlcl.png)
+
+Go to the next page to get familiar with the application's user interface.

docs/services/chemlocallink/ui.mdx

@@ -0,0 +1,107 @@
+---
+title: UI
+sidebar_position: 3
+---
+
+ChemLocalLink is designed to make handling Chemotion ELN files simple and intuitive. Below is an overview of its sections.
+
+### Theme Toggle and Version Buttons
+
+Located in the top-left corner, the **Theme Toggle** and **App Version** buttons.
+
+![Theme Toggle and Version Button](/img/chemlocallink/topbtns.png)
+
+- Clicking the **Theme Toggle** button switches the application theme.
+- Hovering over the **App Version** button will display the current version of the app.
+
+### File Actions
+
+Several actions are available for managing downloaded files:
+
+- **Upload & Delete Locally**
+- **Open File**
+- **Open Downloads Folder**
+- **Delete File**
+
+![File Actions](/img/chemlocallink/actionbtns.png)
+
+These buttons are only enabled when a file is selected. One exception is the upload button, clicking on it will upload all the uploadable files if there is no specific file selected.
+
+### Downloads List
+
+The **Downloads List** displays all the files you've downloaded. Each entry shows:
+
+- **File name**
+- **File size**
+- **File path**
+- **Download timestamp**
+- **Kept** or **Edited** Badge is shown for files that have been modified or kept locally.
+- **Green** or **Red** Dot for validity of the Upload
+
+:::info
+Green means the API Upload Token is still valid, red means it is expired.
+If it is red and you want to edit and upload a file, then you will have to download it again!
+For more information please contact the [developer](mailto:[email protected]).
+:::
+
+![Downloads List](/img/chemlocallink/fileentries.png)
+
+### Context Menu for Downloads
+
+Right-clicking on any file in the **Downloads List** opens a context menu with the following options:
+
+- **Upload & Delete Locally**
+- **Upload & Keep Locally**
+- **Delete File Locally**
+- **Open File**
+- **Open Folder**
+
+![Context Menu](/img/chemlocallink/rightclick.png)
+
+### Status Bar
+
+The **Status Bar** at the bottom of the application shows real-time updates of the application’s status. Current possible status:
+
+- **"Downloading File..."**
+- **"Failed to download file"**
+- **"Failed to extract token!"**
+- **"Failed to upload file(s)"**
+- **"File access error!"**
+- **"File downloaded successfully!"**
+- **"File(s) uploaded successfully"**
+- **"Invalid URL format!"**
+- **"Kept files cannot be uploaded!"**
+- **"Network error!"**
+- **"No downloaded files"**
+- **"Not edited yet!"**
+- **"Unexpected error!"**
+
+:::info
+When reporting an issue, kindly add the respective **Status** message to your report.
+:::
+
+### Notifications
+
+ChemLocalLink provides real-time notifications to keep users informed about file-related activities.
+Here is an example notification:
+
+![Notifications](/img/chemlocallink/notification.png)
+
+### Tray Icon
+
+To have quick access to key functionalities even when the app is minimized or running in the background, you can use through the tray icon.
+
+By right-clicking on the tray icon, you can access the following options:
+
+- **Open App**: Restores the app from the tray.
+- **Upload All Edited Files & Delete Locally**: Uploads all the edited files and deletes them from your local machine.
+- **Upload All Edited Files & Keep Locally**: Uploads all edited files while keeping the local copies.
+- **Open Files Folder**: Opens the folder where the downloaded files are stored.
+- **Exit App**: Closes the app and removes it from the system tray.
+
+![Tray Menu](/img/chemlocallink/tray.png)
+
+### No Files
+
+If there are no files in the downloads list, the app will display the following message:  
+Nothing to show.. Do something.. Open Chemotion Files Locally!