Fix/nc32 compatibility #1736 (#152)

* Documentation updated / Overlay fix NC32 ok - needs testing NC31 / Trying to fix button

* Fix to the icon svg on NC32

Author: JoaoSRaposo

README.md

@@ -21,7 +21,7 @@ This plugin integrates [Swarm](https://www.ethswarm.org/) (a decentralized, bloc
 
 Before using the plugin, ensure you have the following:
 
--   An active Nextcloud instance (version 30 or 31)
+-   An active Nextcloud instance (version 30, 31 or 32)
 -   A valid Access Key and URL to activate the service
     -   [Get Your Free Trial for the Nextcloud Swarm Plugin](https://app.hejbit.com)
 
@@ -49,14 +49,12 @@ Once installed, HejBit Swarm integrates directly with Nextcloud’s "Files" sect
 
 Additionally, we have introduced a HejBit Feedback button that appears in the bottom left corner when you are inside a HejBit folder. This feature allows users to easily send feedback regarding general inquiries, ideas, or issues directly from the plugin.
 
-
 ### Settings
 
 Users with administrative credentials can configure the plugin through the standard External Storage settings. Here, you can input your Access Key and URL for HejBit Swarm.
 
 ![Basic HejBit Swarm setup in External Storage in Nextcloud administration](https://github.com/user-attachments/assets/3e80f664-86b9-4cfa-bbc5-6f9f1fbeb94a)
 
-
 ### Usage
 
 Once setup and configured, the Decentralized Storage is ready to use.

appinfo/info.xml

@@ -26,7 +26,7 @@ This plugin integrates [Swarm](https://www.ethswarm.org/) (a decentralized, bloc
 
 Before using the plugin, ensure you have the following:
 
-- An active Nextcloud instance (version 30 or 31)
+- An active Nextcloud instance (version 30, 31 or 32)
 - A valid Access Key and URL to activate the service
   - [Get Your Free Trial for the Nextcloud Swarm Plugin](https://app.hejbit.com)
 
@@ -104,7 +104,7 @@ This program is licensed under the AGPLv3 or later.
     <repository type="git">https://github.com/MetaProvide/nextcloud-swarm-plugin.git</repository>
 	<screenshot>https://raw.githubusercontent.com/MetaProvide/nextcloud-swarm-plugin/main/assets/images/swarm_Files.png</screenshot>
     <dependencies>
-        <nextcloud min-version="30" max-version="31"/>
+        <nextcloud min-version="30" max-version="32"/>
     </dependencies>
 	<settings>
 		<admin>OCA\Files_External_Ethswarm\Settings\Admin</admin>

css/app.css

@@ -7,11 +7,26 @@
 	pointer-events: none;
 }
 
+.hejbit-overlay-32 {
+	position: absolute;
+	top: 23px;
+	left: 60px;
+	width: 16px;
+	height: 16px;
+	pointer-events: none;
+}
+
 .hejbit-overlay svg {
 	width: 16px;
 	height: 16px;
 }
 
+.hejbit-overlay-32 svg {
+	width: 16px;
+	height: 16px;
+}
+
+
 .hejbit-archive svg {
 	filter: grayscale(100%);
 	border: 1px dashed #f6c915;

img/hejbit-logo-padded.svg

@@ -1,9 +1,13 @@
 import { FileAction, registerFileAction } from "@nextcloud/files";
 import { showInfo } from "@nextcloud/dialogs";
 import HejBitSvg from "@/../img/hejbit-logo.svg";
+import HejBitPaddedSvg from "@/../img/hejbit-logo-padded.svg";
 import InfoSvg from "@material-design-icons/svg/filled/info.svg";
 import FilesHelper from "@/util/FilesHelper";
 import SvgHelper from "@/util/SvgHelper";
+import { loadState } from '@nextcloud/initial-state';
+
+
 
 registerFileAction(
 	new FileAction({
@@ -29,24 +33,39 @@ registerFileAction(
 		},
 
 		iconSvgInline(files, view) {
-			return SvgHelper.convert(
-				FilesHelper.isArchiveFolder(files) ? InfoSvg : HejBitSvg
-			);
+			const config = loadState('core', 'config');
+            const majorVersion = config?.version ? parseInt(config.version.split('.')[0]) : null;
+			if (majorVersion === 32){
+				return SvgHelper.convert(FilesHelper.isArchiveFolder(files) ? InfoSvg : HejBitPaddedSvg);
+			}else{
+				return SvgHelper.convert(FilesHelper.isArchiveFolder(files) ? InfoSvg : HejBitSvg);
+			}
+
 		},
 
 		inline(file, view) {
 			return true;
 		},
 
 		async renderInline(node, view) {
+
+			const config = loadState('core', 'config');
+            const majorVersion = config?.version ? parseInt(config.version.split('.')[0]) : null;
+
 			// Create the overlay element
 			const overlay = document.createElement("div");
-			overlay.classList.add("hejbit-overlay");
+
+            if (majorVersion === 32) {
+				overlay.classList.add("hejbit-overlay-32");
+            } else {
+                overlay.classList.add("hejbit-overlay");
+            }
 
 			if (FilesHelper.isArchive(node)) {
 				overlay.classList.add("hejbit-archive");
 			}
 
+
 			overlay.innerHTML = SvgHelper.convert(HejBitSvg);
 
 			return overlay;