notes-to-strapi-export-article-ai 1.0.119 → 3.0.2

package/src/utils/preview-modal.ts

@@ -0,0 +1,265 @@
+import { App, Modal, Notice, Setting } from 'obsidian'
+import { AnalyzedContent } from '../types'
+import { FrontmatterGenerator } from '../services/frontmatter'
+import StrapiExporterPlugin from '../main'
+
+export class PreviewModal extends Modal {
+	private content: AnalyzedContent
+	private plugin: StrapiExporterPlugin
+	private onConfirm: () => void
+	private onCancel: () => void
+	private frontmatterGenerator: FrontmatterGenerator
+
+	constructor(
+		app: App,
+		content: AnalyzedContent,
+		plugin: StrapiExporterPlugin,
+		onConfirm: () => void,
+		onCancel?: () => void
+	) {
+		super(app)
+		this.plugin = plugin
+		this.content = content
+		this.onConfirm = onConfirm
+		this.onCancel = onCancel || (() => {})
+
+		// Initialize with plugin instance
+		this.frontmatterGenerator = new FrontmatterGenerator(this.plugin)
+	}
+
+	onOpen() {
+		const { contentEl } = this
+
+		try {
+			this.createHeader(contentEl)
+			this.createGenerateButton(contentEl)
+			this.createPreviewContainer(contentEl)
+			this.createButtons(contentEl)
+			this.addStyles()
+		} catch (error) {
+			this.showError('Failed to render preview' + error.message)
+		}
+	}
+
+	private createHeader(container: HTMLElement) {
+		container.createEl('h2', {
+			text: 'Content Preview',
+			cls: 'preview-modal-title',
+		})
+
+		container.createEl('p', {
+			text: 'Review or generate frontmatter before exporting to Strapi.',
+			cls: 'preview-modal-description',
+		})
+	}
+
+	private createGenerateButton(container: HTMLElement) {
+		new Setting(container)
+			.setName('Generate Metadata')
+			.setDesc('Use AI to generate frontmatter metadata for your content')
+			.addButton(button =>
+				button
+					.setButtonText('Generate')
+					.setCta()
+					.onClick(async () => {
+						try {
+							await this.generateFrontmatter()
+						} catch (error) {
+							new Notice(`Failed to generate metadata: ${error.message}`)
+						}
+					})
+			)
+	}
+
+	private async generateFrontmatter() {
+		new Notice('Generating frontmatter...')
+
+		// Get the active file
+		const file = this.app.workspace.getActiveFile()
+		if (!file) {
+			throw new Error('No active file')
+		}
+
+		// Generate frontmatter
+		const updatedContent =
+			await this.frontmatterGenerator.updateContentFrontmatter(file, this.app)
+
+		// Update content object
+		this.content.content = updatedContent
+
+		// Update preview
+		this.updatePreview()
+		await this.app.vault.modify(file, updatedContent)
+
+		new Notice('Frontmatter generated successfully!')
+	}
+
+	private createPreviewContainer(container: HTMLElement) {
+		const previewContainer = container.createDiv('preview-container')
+		this.createContentSections(previewContainer)
+	}
+
+	private updatePreview() {
+		const previewContainer = this.contentEl.querySelector('.preview-container')
+		if (previewContainer) {
+			previewContainer.empty()
+			this.createContentSections(previewContainer)
+		}
+	}
+
+	private createContentSections(container: Element) {
+		// Main content section
+		if (this.content.content) {
+			const contentSection = this.createSection(
+				container.createDiv(),
+				'Main Content',
+				this.content.content,
+				'content-section'
+			)
+			contentSection.addClass('main-content')
+		}
+	}
+
+	createSection(
+		container: HTMLElement,
+		title: string,
+		content: any,
+		className: string
+	): HTMLElement {
+		const section = container.createDiv(className)
+		section.createEl('h3', { text: title })
+
+		const previewEl = section.createEl('pre')
+		previewEl.setText(
+			typeof content === 'string' ? content : JSON.stringify(content, null, 2)
+		)
+
+		return section
+	}
+
+	private createButtons(container: HTMLElement) {
+		const buttonContainer = container.createDiv('button-container')
+
+		// Confirm button
+		new Setting(buttonContainer).addButton(button => {
+			button
+				.setButtonText('Confirm & Export')
+				.setCta()
+				.onClick(() => {
+					this.close()
+					this.onConfirm()
+				})
+		})
+
+		// Cancel button
+		new Setting(buttonContainer).addButton(button => {
+			button.setButtonText('Cancel').onClick(() => {
+				this.close()
+				this.onCancel()
+			})
+		})
+	}
+
+	private addStyles() {
+		document.body.addClass('preview-modal-open')
+
+		const styles = `
+            .preview-modal-title {
+                margin-bottom: 1em;
+                padding-bottom: 0.5em;
+                border-bottom: 1px solid var(--background-modifier-border);
+            }
+
+            .preview-modal-description {
+                margin-bottom: 1.5em;
+                color: var(--text-muted);
+            }
+
+            .preview-container {
+                max-height: 60vh;
+                overflow-y: auto;
+                margin-bottom: 1.5em;
+                padding: 1em;
+                border: 1px solid var(--background-modifier-border);
+                border-radius: 4px;
+            }
+
+            .content-section,
+            .metadata-section {
+                margin-bottom: 1.5em;
+            }
+
+            .content-section h3,
+            .metadata-section h3 {
+                margin-bottom: 0.5em;
+                color: var(--text-normal);
+            }
+
+            .content-section pre,
+            .metadata-section pre {
+                padding: 1em;
+                background-color: var(--background-primary-alt);
+                border-radius: 4px;
+                overflow-x: auto;
+            }
+
+            .button-container {
+                display: flex;
+                justify-content: flex-end;
+                gap: 1em;
+                margin-top: 1em;
+            }
+            
+            .button-container .setting-item {
+            		align-items: end;
+            		border: none;
+            }
+        `
+
+		document.head.createEl('style', {
+			attr: { type: 'text/css' },
+			text: styles,
+		})
+	}
+
+	private showError(message: string) {
+		const { contentEl } = this
+		contentEl.empty()
+
+		contentEl.createEl('h2', {
+			text: 'Error',
+			cls: 'preview-modal-error-title',
+		})
+
+		contentEl.createEl('p', {
+			text: message,
+			cls: 'preview-modal-error-message',
+		})
+	}
+
+	onClose() {
+		const { contentEl } = this
+		contentEl.empty()
+		document.body.removeClass('preview-modal-open')
+	}
+}
+
+export function showPreviewToUser(
+	app: App,
+	content: AnalyzedContent,
+	plugin: StrapiExporterPlugin
+): Promise<boolean> {
+	return new Promise(resolve => {
+		new PreviewModal(
+			app,
+			content,
+			plugin,
+			() => {
+				resolve(true)
+			},
+			() => {
+				resolve(false)
+			}
+		).open()
+	})
+}

package/src/utils/process-file.ts

@@ -0,0 +1,122 @@
+import { App, TFile } from 'obsidian'
+import { StrapiExporterSettings, AnalyzedContent } from '../types'
+import { uploadImageToStrapi } from './strapi-uploader'
+
+interface ImageMatch {
+	fullMatch: string
+	altText: string
+	imagePath: string
+}
+
+/**
+ * Process images in content fields and upload them to Strapi
+ */
+export async function processImages(
+	content: AnalyzedContent,
+	app: App,
+	settings: StrapiExporterSettings
+): Promise<AnalyzedContent> {
+	const processedContent = { ...content }
+
+	for (const [key, value] of Object.entries(processedContent)) {
+		if (typeof value === 'string') {
+			processedContent[key] = await processImageLinks(value, app, settings)
+		}
+	}
+
+	return processedContent
+}
+
+/**
+ * Process image links in content string
+ */
+async function processImageLinks(
+	content: string,
+	app: App,
+	settings: StrapiExporterSettings
+): Promise<string> {
+	const imageMatches = extractImageMatches(content)
+
+	let processedContent = content
+
+	for (const match of imageMatches) {
+		const replacedContent = await processImageMatch(
+			match,
+			processedContent,
+			app,
+			settings
+		)
+
+		if (replacedContent !== processedContent) {
+			processedContent = replacedContent
+		}
+	}
+
+	return processedContent
+}
+
+/**
+ * Extract image matches from content
+ */
+function extractImageMatches(content: string): ImageMatch[] {
+	const matches: ImageMatch[] = []
+	const imageRegex = /!\[([^\]]*)\]\(([^)]+)\)/g
+	let match
+
+	while ((match = imageRegex.exec(content)) !== null) {
+		matches.push({
+			fullMatch: match[0],
+			altText: match[1],
+			imagePath: match[2],
+		})
+	}
+
+	return matches
+}
+
+/**
+ * Process individual image match
+ */
+async function processImageMatch(
+	match: ImageMatch,
+	content: string,
+	app: App,
+	settings: StrapiExporterSettings
+): Promise<string> {
+	if (isExternalUrl(match.imagePath)) {
+		return content
+	}
+
+	const file = app.vault.getAbstractFileByPath(match.imagePath)
+	if (!(file instanceof TFile)) {
+		return content
+	}
+
+	const uploadedImage = await uploadImageToStrapi(
+		file,
+		file.name,
+		settings,
+		app,
+		{
+			alternativeText: match.altText || file.basename,
+			caption: match.altText || file.basename,
+		}
+	)
+
+	if (uploadedImage?.url) {
+		const newContent = content.replace(
+			match.fullMatch,
+			`![${match.altText}](${uploadedImage.url})`
+		)
+		return newContent
+	}
+
+	return content
+}
+
+/**
+ * Check if URL is external
+ */
+function isExternalUrl(url: string): boolean {
+	return url.startsWith('http://') || url.startsWith('https://')
+}

package/src/utils/strapi-uploader.ts

@@ -1,137 +1,138 @@
-import { Notice } from 'obsidian'
-import { StrapiExporterSettings } from '../types/settings'
-import { ImageBlob, ImageDescription } from '../types/image'
+import { App, Notice, TAbstractFile, TFile } from 'obsidian'
+import { StrapiExporterSettings, ImageDescription } from '../types'
+
+interface UploadResponse {
+	url: string
+	id: number
+	name: string
+	alternativeText?: string
+	caption?: string
+}
 
 /**
- * Upload images to Strapi
- * @param imageDescriptions
- * @param settings
- * @param app
- * @param imageFolderPath
+ * Upload single image to Strapi
  */
-export async function uploadImagesToStrapi(
-	imageDescriptions: ImageDescription[],
+export async function uploadImageToStrapi(
+	imageData: string | TFile,
+	fileName: string,
 	settings: StrapiExporterSettings,
-	app: any = null,
-	imageFolderPath: string = ''
-): Promise<{ [key: string]: { url: string; data: any } }> {
-	const uploadedImages: { [key: string]: { url: string; data: any; id: any } } =
-		{}
-
-	for (const imageDescription of imageDescriptions) {
-		const formData = new FormData()
-		formData.append('files', imageDescription.blob, imageDescription.name)
+	app: App,
+	additionalMetadata?: {
+		alternativeText?: string
+		caption?: string
+	}
+): Promise<ImageDescription | null> {
+	// Validate settings
+	validateStrapiSettings(settings)
+
+	// Get file
+	const file = await getFileFromImageData(imageData, fileName, app)
+	if (!file) {
+		return null
+	}
+
+	// Prepare form data
+	const formData = await prepareFormData(file, fileName, additionalMetadata)
+
+	// Upload to Strapi
+	const uploadResult = await performStrapiUpload(formData, settings)
+
+	if (uploadResult) {
+		return createImageDescription(uploadResult, fileName, additionalMetadata)
+	}
+
+	return null
+}
+// Helper functions
+
+async function getFileFromImageData(
+	imageData: string | TFile,
+	fileName: string,
+	app: App
+): Promise<TFile | null> {
+	let file: TAbstractFile | null = null
+	if (typeof imageData === 'string') {
+		file = app.vault.getAbstractFileByPath(imageData)
+	} else if (imageData instanceof TFile) {
+		file = imageData
+	}
+
+	if (!(file instanceof TFile)) {
+		new Notice(`Failed to find file: ${fileName}`)
+		return null
+	}
+
+	return file
+}
+
+async function prepareFormData(
+	file: TFile,
+	fileName: string,
+	metadata?: { alternativeText?: string; caption?: string }
+): Promise<FormData> {
+	const formData = new FormData()
+	const arrayBuffer = await file.vault.readBinary(file)
+	const blob = new Blob([arrayBuffer], { type: `image/${file.extension}` })
+	formData.append('files', blob, fileName)
+
+	if (metadata) {
 		formData.append(
 			'fileInfo',
 			JSON.stringify({
-				name: imageDescription.description.name,
-				alternativeText: imageDescription.description.alternativeText,
-				caption: imageDescription.description.caption,
+				name: fileName,
+				alternativeText: metadata.alternativeText,
+				caption: metadata.caption,
 			})
 		)
-
-		try {
-			const response = await fetch(`${settings.strapiUrl}/api/upload`, {
-				method: 'POST',
-				headers: {
-					Authorization: `Bearer ${settings.strapiApiToken}`,
-				},
-				body: formData,
-			})
-
-			if (response.ok) {
-				const data = await response.json()
-				uploadedImages[imageDescription.name] = {
-					url: data[0].url,
-					data: data[0],
-					id: data[0].id,
-				}
-			} else {
-				const errorData = await response.json()
-				new Notice(
-					`Failed to upload image: ${imageDescription.name}. Error: ${errorData.error.message}`
-				)
-			}
-		} catch (error) {
-			new Notice(
-				`Error uploading image: ${imageDescription.name}. Error: ${error.message}`
-			)
-		}
 	}
 
-	if (imageFolderPath && app) {
-		// Save metadata to a file only if there are uploaded images
-		if (Object.keys(uploadedImages).length > 0) {
-			const metadataFile = `${imageFolderPath}/metadata.json`
-			await app.vault.adapter.write(
-				metadataFile,
-				JSON.stringify(uploadedImages)
-			)
-		}
-	}
-	return uploadedImages
+	return formData
 }
 
-/**
- * Upload gallery images to Strapi
- * @param imageBlobs
- * @param settings
- * @param app
- * @param galleryFolderPath
- */
-export async function uploadGalleryImagesToStrapi(
-	imageBlobs: ImageBlob[],
-	settings: StrapiExporterSettings,
-	app: any = null,
-	galleryFolderPath: string = ''
-): Promise<number[]> {
-	const uploadedImageIds: number[] = []
-	const uploadedImages: { [key: string]: { url: string; data: any; id: any } } =
-		{}
-
-	for (const imageBlob of imageBlobs) {
-		const formData = new FormData()
-		formData.append('files', imageBlob.blob, imageBlob.name)
-
-		try {
-			const response = await fetch(`${settings.strapiUrl}/api/upload`, {
-				method: 'POST',
-				headers: {
-					Authorization: `Bearer ${settings.strapiApiToken}`,
-				},
-				body: formData,
-			})
+async function performStrapiUpload(
+	formData: FormData,
+	settings: StrapiExporterSettings
+): Promise<UploadResponse | null> {
+	const response = await fetch(`${settings.strapiUrl}/api/upload`, {
+		method: 'POST',
+		headers: {
+			Authorization: `Bearer ${settings.strapiApiToken}`,
+		},
+		body: formData,
+	})
 
-			if (response.ok) {
-				const data = await response.json()
-				uploadedImages[imageBlob.name] = {
-					url: data[0].url,
-					id: data[0].id,
-					data: data[0],
-				}
-			} else {
-				const errorData = await response.json()
-				new Notice(
-					`Failed to upload gallery image: ${imageBlob.name}. Error: ${errorData.error.message}`
-				)
-			}
-		} catch (error) {
-			new Notice(
-				`Error uploading gallery image: ${imageBlob.name}. Error: ${error.message}`
-			)
-		}
+	if (!response.ok) {
+		const errorData = await response.json()
+		throw new Error(errorData.error.message)
 	}
 
-	if (galleryFolderPath && app) {
-		// Save metadata to a file only if there are uploaded images
-		if (Object.keys(uploadedImages).length > 0) {
-			const metadataFile = `${galleryFolderPath}/metadata.json`
-			await app.vault.adapter.write(
-				metadataFile,
-				JSON.stringify(uploadedImages)
-			)
-		}
-	}
+	const data = await response.json()
+	return data[0]
+}
 
-	return uploadedImageIds
+function validateStrapiSettings(settings: StrapiExporterSettings): void {
+	if (!settings.strapiUrl) {
+		throw new Error('Strapi URL is not configured')
+	}
+	if (!settings.strapiApiToken) {
+		throw new Error('Strapi API token is not configured')
+	}
+}
+function createImageDescription(
+	uploadResult: UploadResponse,
+	fileName: string,
+	metadata?: { alternativeText?: string; caption?: string }
+): ImageDescription {
+	return {
+		url: uploadResult.url,
+		name: fileName,
+		path: uploadResult.url,
+		id: uploadResult.id,
+		description: {
+			name: uploadResult.name,
+			alternativeText:
+				uploadResult.alternativeText || metadata?.alternativeText || '',
+			caption: uploadResult.caption || metadata?.caption || '',
+		},
+	}
 }