Add local markdown documentation and update configuration for markdown loading

- Integrated local markdown files for Ollama setup and reference guide
- Updated Vite configuration to support markdown file imports
- Modified DocViewerModal to use local markdown instead of remote URLs
- Added markdown documentation files in the project
- Updated screenshot processor and other minor configurations

Addressed all concerns from PR

manifest.json

@@ -1,7 +1,7 @@
 {
   "id": "vision-recall",
   "name": "Vision Recall",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "minAppVersion": "1.8.3",
   "description": "Transform screenshots into searchable notes using AI vision and text analysis.",
   "author": "Travis Van Nimwegen",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "obsidian-vision-recall",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Transform screenshots into searchable Obsidian notes using AI vision and text analysis.",
   "main": "main.js",
   "scripts": {

src/components/modals/DocViewerModal.tsx

@@ -2,6 +2,10 @@ import { App, MarkdownRenderer, Modal, requestUrl } from 'obsidian';
 import React, { useEffect, useRef, useState } from 'react';
 import { createRoot } from 'react-dom/client';
 import VisionRecallPlugin from '@/main';
+// import ollamaSetup from './ollama-setup.md';
+// import referenceGuide from './reference.md';
+import ollamaSetup from '@/docs/ollama-setup.md';
+import referenceGuide from '@/docs/reference.md';
 
 interface DocViewerFormProps {
   onClose: () => void;
@@ -10,8 +14,8 @@ interface DocViewerFormProps {
 }
 
 const DOC_LOCATIONS = {
-  'ollama-setup': 'https://raw.githubusercontent.com/travisvn/obsidian-vision-recall/main/docs/ollama-setup.md',
-  'reference-guide': 'https://raw.githubusercontent.com/travisvn/obsidian-vision-recall/main/docs/reference.md',
+  'ollama-setup': ollamaSetup,
+  'reference-guide': referenceGuide,
 }
 
 const DocViewerForm: React.FC<DocViewerFormProps> = ({ onClose, app, plugin }) => {
@@ -20,25 +24,26 @@ const DocViewerForm: React.FC<DocViewerFormProps> = ({ onClose, app, plugin }) =
   const [content, setContent] = useState<string>('');
   const [error, setError] = useState<string>('');
 
-  const fetchContent = async (url: string) => {
-    try {
-      // const response = await fetch(url);
-      const response = await requestUrl(url);
-      if (response.status !== 200) {
-        throw new Error(`HTTP error! status: ${response.status}`);
-      }
-      const text = response.text;
-      return text;
-    } catch (error) {
-      console.error('Error fetching content:', error);
-      setError('Failed to fetch content');
-      return '';
-    }
-  }
+  // const fetchContent = async (url: string) => {
+  //   try {
+  //     // const response = await fetch(url);
+  //     const response = await requestUrl(url);
+  //     if (response.status !== 200) {
+  //       throw new Error(`HTTP error! status: ${response.status}`);
+  //     }
+  //     const text = response.text;
+  //     return text;
+  //   } catch (error) {
+  //     console.error('Error fetching content:', error);
+  //     setError('Failed to fetch content');
+  //     return '';
+  //   }
+  // }
 
   useEffect(() => {
     const fetchContentEffect = async () => {
-      const content = await fetchContent(DOC_LOCATIONS[selectedDoc]);
+      // const content = await fetchContent(DOC_LOCATIONS[selectedDoc]);
+      const content = DOC_LOCATIONS[selectedDoc];
       setContent(content);
     }
     fetchContentEffect();

src/data/DataManager.ts

@@ -443,9 +443,7 @@ export class DataManager extends Events {
           }
         }
 
-        this.plugin.app.vault.process(file, (data: string) => {
-          return dataStr;
-        });
+        this.plugin.app.vault.modify(file, dataStr);
         this.plugin.logger.info("modified existing file", file.path);
       }
     }

src/main.ts

@@ -97,9 +97,11 @@ export default class VisionRecallPlugin extends Plugin {
 			)
 		}
 
-		this.dataManager.on('unprocessed-images-found', async () => {
-			await this.screenshotProcessor.processIntakeFolderAuto();
-		});
+		this.registerEvent(
+			this.dataManager.on('unprocessed-images-found', async () => {
+				await this.screenshotProcessor.processIntakeFolderAuto();
+			})
+		)
 	}
 
 	private registerCommands() {
@@ -335,6 +337,6 @@ export default class VisionRecallPlugin extends Plugin {
 			}
 		}
 
-		return newFolderPath;
+		return normalizePath(newFolderPath);
 	}
 }

src/services/screenshot-processor.ts

@@ -1,4 +1,4 @@
-import { App, FileManager, Notice, TFile, TFolder, normalizePath } from 'obsidian';
+import { App, FileManager, Notice, TFile, TFolder, arrayBufferToBase64, normalizePath } from 'obsidian';
 import Tesseract, { createWorker, Worker } from 'tesseract.js';
 import { VisionRecallPluginSettings } from '@/types/settings-types';
 import { DEFAULT_TAGS_AND_TITLE, TagsAndTitle, VISION_LLM_PROMPT, callLLMAPI, llmSuggestTagsAndTitle } from '@/services/llm-service';
@@ -331,7 +331,7 @@ export class ScreenshotProcessor {
   private async performVisionAnalysis(imageFile: TFile, ocrText: string): Promise<string | null> {
     try {
       const imageBuffer = await this.app.vault.readBinary(imageFile);
-      const base64Image = base64EncodeImage(imageBuffer);
+      const base64Image = arrayBufferToBase64(imageBuffer);
 
       const visionPayload = {
         model: this.settings.visionModelName,

src/styles/global.scss

@@ -95,10 +95,6 @@
     opacity: 1;
   }
 
-  .edge-tts-status-bar-control:hover {
-    color: var(--interactive-accent);
-  }
-
   .vr-loader {
     border: 4px solid rgba(0, 0, 0, 0.1);
     border-left-color: #000;

versions.json

@@ -3,5 +3,6 @@
   "1.0.1": "0.15.0",
   "1.0.2": "0.15.0",
   "1.0.3": "0.15.0",
-  "1.0.4": "1.8.3"
+  "1.0.4": "1.8.3",
+  "1.0.5": "1.8.3"
 }

vite.config.ts

@@ -8,7 +8,17 @@ export default defineConfig(async ({ mode }) => {
   const prod = mode === "production";
 
   return {
-    plugins: [react()],
+    plugins: [
+      react(),
+      {
+        name: "markdown-loader",
+        transform(code, id) {
+          if (id.slice(-3) === ".md") {
+            return `export default ${JSON.stringify(code)};`;
+          }
+        },
+      },
+    ],
     resolve: {
       alias: {
         "@": path.resolve(__dirname, "./src")