AI Proofread: Use Button and set extension as true on tables

Automattic · Jul 16, 2024 · be625c5 · be625c5
1 parent 60619bb
commit be625c5
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 11 deletions.
diff --git a/...ugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/index.tsx b/...ugins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/index.tsx
@@ -96,7 +96,7 @@ export default function Highlight() {
 
 	const handleApplySuggestion = () => {
 		// Apply known fixes
-		const render = fixes.table( fixes.listItem( suggestions?.html, true ) );
+		const render = fixes.table( fixes.listItem( suggestions?.html, true ), true );
 		const [ newBlock ] = rawHandler( { HTML: render } );
 		updateBlockAttributes( block, newBlock.attributes );
 	};
@@ -126,9 +126,9 @@ export default function Highlight() {
 						</div>
 						{ hasSuggestions ? (
 							<div className="suggestion-container">
-								<button className="suggestion" onClick={ handleApplySuggestion }>
+								<Button variant="tertiary" onClick={ handleApplySuggestion }>
 									{ suggestions?.suggestion }
-								</button>
+								</Button>
 								<div className="helper">
 									{ __( 'Click on a suggestion to insert it.', 'jetpack' ) }
 								</div>

diff --git a/...gins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/style.scss b/...gins/jetpack/extensions/plugins/ai-assistant-plugin/components/breve/highlight/style.scss
@@ -75,20 +75,16 @@
 			flex-direction: column;
 			border-top: 1px solid #dcdcde;
 
-			.suggestion {
-				padding: 14px 8px;
-				cursor: pointer;
-				&:hover {
-					background-color: #dcdcde;
-				}
-			}
-
 			.helper {
 				padding: 8px;
 				background-color: #f6f7f7;
 				white-space: nowrap;
 				color: #646970;
 			}
+
+			.components-button.is-tertiary {
+				color: #000000;
+			}
 		}
 	}
 }