From b31882565b6ef6c44daae64d1c0b2427b940dc1b Mon Sep 17 00:00:00 2001
From: Mathew Pareles <mathewpareles@gmail.com>
Date: Thu, 2 Jan 2025 17:11:31 -0800
Subject: [PATCH] fix watchreact

---
 .../contrib/void/browser/react/build.js       | 37 +++++++++++++++++--
 .../browser/react/src/markdown/BlockCode.tsx  |  1 -
 .../react/src/markdown/ChatMarkdownRender.tsx |  5 +--
 .../react/src/sidebar-tsx/SidebarChat.tsx     | 28 ++++++--------
 .../void/browser/react/src/util/inputs.tsx    |  2 +-
 5 files changed, 49 insertions(+), 24 deletions(-)

diff --git a/src/vs/workbench/contrib/void/browser/react/build.js b/src/vs/workbench/contrib/void/browser/react/build.js
index 118e2eaa..1ce5a6ee 100755
--- a/src/vs/workbench/contrib/void/browser/react/build.js
+++ b/src/vs/workbench/contrib/void/browser/react/build.js
@@ -4,13 +4,42 @@
  *--------------------------------------------------------------------------------------------*/
 
 import { spawn, execSync } from 'child_process';
+// Added lines below
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const __void_name = 'void'
+
+// hack to refresh styles automatically
+function saveStylesFile() {
+	setTimeout(() => {
+		try {
+			// Find "void" in __dirname and use that as our base:
+			const voidIdx = __dirname.indexOf(__void_name);
+			const baseDir = __dirname.substring(0, voidIdx + __void_name.length);
+			const target = path.join(
+				baseDir,
+				'src/vs/workbench/contrib/void/browser/react/src2/styles.css'
+			);
+
+			// Or re-write with the same content:
+			const content = fs.readFileSync(target, 'utf8');
+			fs.writeFileSync(target, content, 'utf8');
+			console.log('[scope-tailwind] Force-saved styles.css');
+		} catch (err) {
+			console.error('[scope-tailwind] Error saving styles.css:', err);
+		}
+	}, 3000);
+}
 
 const args = process.argv.slice(2);
 const isWatch = args.includes('--watch') || args.includes('-w');
 
 if (isWatch) {
 	// Watch mode
-	// Create a watcher for scope-tailwind using nodemon
 	const scopeTailwindWatcher = spawn('npx', [
 		'nodemon',
 		'--watch', 'src',
@@ -19,15 +48,17 @@ if (isWatch) {
 		'npx scope-tailwind ./src -o src2/ -s void-scope -c styles.css -p "void-"'
 	]);
 
-	// Create a watcher for tsup in watch mode
 	const tsupWatcher = spawn('npx', [
 		'tsup',
 		'--watch'
 	]);
 
-	// Handle scope-tailwind watcher output
 	scopeTailwindWatcher.stdout.on('data', (data) => {
 		console.log(`[scope-tailwind] ${data}`);
+		// If the output mentions "styles.css", trigger the save:
+		if (data.toString().includes('styles.css')) {
+			saveStylesFile();
+		}
 	});
 
 	scopeTailwindWatcher.stderr.on('data', (data) => {
diff --git a/src/vs/workbench/contrib/void/browser/react/src/markdown/BlockCode.tsx b/src/vs/workbench/contrib/void/browser/react/src/markdown/BlockCode.tsx
index 8ecc9e8f..e64c43c3 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/markdown/BlockCode.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/markdown/BlockCode.tsx
@@ -70,7 +70,6 @@ export const BlockCode = ({ text, buttonsOnHover, language }: { text: string, bu
 
 	return (<>
 		<div className={`relative group w-full bg-vscode-editor-bg overflow-hidden isolate`}>
-
 			{buttonsOnHover === null ? null : (
 				<div className="z-[1] absolute top-0 right-0 opacity-0 group-hover:opacity-100 duration-200">
 					<div className={`flex space-x-2 ${isSingleLine ? '' : 'p-2'}`}>{buttonsOnHover}</div>
diff --git a/src/vs/workbench/contrib/void/browser/react/src/markdown/ChatMarkdownRender.tsx b/src/vs/workbench/contrib/void/browser/react/src/markdown/ChatMarkdownRender.tsx
index 62d24b1c..ef5221f7 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/markdown/ChatMarkdownRender.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/markdown/ChatMarkdownRender.tsx
@@ -45,19 +45,18 @@ const CodeButtonsOnHover = ({ text }: { text: string }) => {
 		})
 	}, [inlineDiffService])
 
-
 	const isSingleLine = !text.includes('\n')
 
 	return <>
 		<button
-			className={`${isSingleLine ? '' : 'p-1'} text-xs hover:brightness-110 bg-vscode-editor-bg border border-vscode-input-border rounded text-xs text-vscode-input-fg`}
+			className={`${isSingleLine ? '' : 'p-1'} text-xs hover:brightness-110 bg-vscode-input-bg border border-vscode-input-border rounded text-xs text-vscode-input-fg`}
 			onClick={onCopy}
 		>
 			{copyButtonState}
 		</button>
 		<button
 			// btn btn-secondary btn-sm border text-xs text-vscode-input-fg border-vscode-input-border rounded
-			className={`${isSingleLine ? '' : 'p-1'} text-xs hover:brightness-110 bg-vscode-editor-bg border border-vscode-input-border rounded text-xs text-vscode-input-fg`}
+			className={`${isSingleLine ? '' : 'p-1'} text-xs hover:brightness-110 bg-vscode-input-bg border border-vscode-input-border rounded text-xs text-vscode-input-fg`}
 			onClick={onApply}
 		>
 			Apply
diff --git a/src/vs/workbench/contrib/void/browser/react/src/sidebar-tsx/SidebarChat.tsx b/src/vs/workbench/contrib/void/browser/react/src/sidebar-tsx/SidebarChat.tsx
index 25f4edbb..0ac769f3 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/sidebar-tsx/SidebarChat.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/sidebar-tsx/SidebarChat.tsx
@@ -276,11 +276,11 @@ export const SelectedFiles = (
 			>
 				{selections.map((selection, i) => {
 
-					const showSelectionText = !!(selection.selectionStr && selectionIsOpened[i])
+					const isThisSelectionOpened = !!(selection.selectionStr && selectionIsOpened[i])
 
 					return (
 						<div key={i} // container for `selectionSummary` and `selectionText`
-							className={`${showSelectionText ? 'w-full' : ''}`}
+							className={`${isThisSelectionOpened ? 'w-full' : ''}`}
 						>
 							{/* selection summary */}
 							<div
@@ -346,8 +346,8 @@ export const SelectedFiles = (
 
 							</div>
 							{/* selection text */}
-							{showSelectionText &&
-								<div className='w-full p-1 rounded-sm border-vscode-editor-border bg-vscode-sidebar-bg'>
+							{isThisSelectionOpened &&
+								<div className='w-full p-1 rounded-sm border-vscode-editor-border'>
 									<BlockCode text={selection.selectionStr!} language={getLanguageFromFileName(selection.fileURI.path)} />
 								</div>
 							}
@@ -383,19 +383,15 @@ const ChatBubble = ({ chatMessage, isLoading }: {
 	}
 
 	return <div
-		// align chatbubble accoridng to role
-		className={`
-			${role === 'user' ? 'self-end' : 'self-start'}
-			${role === 'assistant' ? 'w-full' : ''}
-		`}
+		// style + align chatbubble accoridng to role
+		className={`p-2 mx-2 text-left space-y-2 rounded-lg max-w-full
+				${role === 'user' ? 'self-end' : 'self-start'}
+				${role === 'user' ? 'bg-vscode-input-bg text-vscode-input-fg' : ''}
+				${role === 'assistant' ? 'w-full' : ''}
+			`}
 	>
-		<div
-			// style chatbubble
-			className={`p-2 mx-2 text-left space-y-2 rounded-lg ${role === 'user' ? 'bg-vscode-input-bg text-vscode-input-fg' : ''} max-w-full overflow-auto`}
-		>
-			{chatbubbleContents}
-			{isLoading && <IconLoading className='opacity-50 text-sm' />}
-		</div>
+		{chatbubbleContents}
+		{isLoading && <IconLoading className='opacity-50 text-sm' />}
 	</div>
 }
 
diff --git a/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx b/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx
index b85f2e2e..402ab1a8 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/util/inputs.tsx
@@ -301,7 +301,7 @@ export const VoidCodeEditor = ({ initValue, language }: { initValue: string, lan
 
 	return <div ref={divRef}>
 		<WidgetComponent
-			className='relative z-0 text-sm !bg-vscode-editor-bg'
+			className='relative z-0 text-sm bg-vscode-editor-bg'
 			ctor={useCallback((container) =>
 				instantiationService.createInstance(
 					CodeEditorWidget,