feat: #77 feature suggestion functionality

.changeset/solid-queens-grab.md

@@ -0,0 +1,6 @@
+---
+'@better-comments-for-github/extension': patch
+'@better-comments-for-github/core': patch
+---
+
+Add support for code suggestion

extension/src/entrypoints/editor-content.ts

@@ -99,6 +99,8 @@ export default defineUnlistedScript(() => {
                   editorElement,
                   suggestionData,
                   setSuggestionData,
+                  suggestedChangesConfig,
+                  setSuggestedChangesConfig,
                 } = editorInstance
 
                 let type: EditorType
@@ -164,6 +166,10 @@ export default defineUnlistedScript(() => {
                   type = 'react'
                   log(`${editorInstance.id} - GitHub textarea is react-based`)
 
+                  reactTextareaHandler.loadSuggestionChangesConfig((data) => {
+                    setSuggestedChangesConfig(data)
+                  })
+
                   reactTextareaHandler.loadSuggestionDataAsync(element, {
                     onSuggestionDataChange: (data) => setSuggestionData(data),
                   })
@@ -221,6 +227,7 @@ export default defineUnlistedScript(() => {
                     id: editorInstance.id,
                     currentUsername,
                     suggestionData,
+                    suggestedChangesConfig,
                     open: showOldEditor,
                     openChange: setShowOldEditor,
                     uploadHandler: editorInjector.uploadHandler!,

extension/src/utils/gitHubReactTextareaHandler.ts

@@ -17,6 +17,9 @@
 import { effect } from 'solid-js/web'
 import { createSuggestionData } from '@better-comments-for-github/core/editor/utils/loadSuggestionData'
 import { createGitHubUploaderReactHandler } from '@better-comments-for-github/core/editor/utils/reactFileUploader'
+import { createSuggestedChangeConfigData } from '@better-comments-for-github/core/editor/utils/loadCodeSuggestionChangesConfig'
+import { createEffect } from 'solid-js'
+import type { SuggestedChangeConfig } from '@better-comments-for-github/core/editor/utils/loadCodeSuggestionChangesConfig'
 import type { SuggestionData } from '@better-comments-for-github/core/editor/utils/loadSuggestionData'
 
 export class GitHubReactTextareaHandler {
@@ -45,6 +48,10 @@ export class GitHubReactTextareaHandler {
     )
   }
 
+  findCommentBoxModule() {
+    return this.root.closest<HTMLElement>('[class*="CommentBox-module"]')
+  }
+
   getUploadHandler() {
     return createGitHubUploaderReactHandler(this.root)
   }
@@ -88,6 +95,19 @@ export class GitHubReactTextareaHandler {
     }
   }
 
+  loadSuggestionChangesConfig(
+    load: (data: SuggestedChangeConfig | undefined) => void,
+  ) {
+    const commentBox = this.findCommentBoxModule()
+    if (!commentBox) {
+      return
+    }
+    const data = createSuggestedChangeConfigData(commentBox)
+    createEffect(() => {
+      load(data())
+    })
+  }
+
   loadSuggestionDataAsync(
     element: HTMLElement,
     callbacks: {

extension/src/utils/githubPageDetector.ts

@@ -14,12 +14,13 @@
  * limitations under the License.
  */
 
-import { createComponent, createUniqueId } from 'solid-js'
+import { createComponent, createSignal, createUniqueId } from 'solid-js'
 import { log } from '@better-comments-for-github/core/editor/utils/logger'
 import { SwitchButton } from '../../../src/render'
 import type { Accessor, ComponentProps, Setter } from 'solid-js'
 import type { GitHubUrlParsedResult } from './githubUrlParser'
 import type { SuggestionData } from '../../../src/editor/utils/loadSuggestionData'
+import type { SuggestedChangeConfig } from '@better-comments-for-github/core/editor/utils/loadCodeSuggestionChangesConfig'
 
 export interface GithubPageInstanceResult {
   readonly currentUsername: Accessor<string | null>
@@ -39,6 +40,8 @@ export interface GitHubPageInstanceOptions {
 export interface GitHubEditorInstance {
   id: string
   rootElement: HTMLElement
+  suggestedChangesConfig: Accessor<SuggestedChangeConfig | undefined>
+  setSuggestedChangesConfig: Setter<SuggestedChangeConfig | undefined>
   suggestionData: Accessor<SuggestionData>
   setInjector: (injector: GitHubEditorInjector) => void
   setSuggestionData: Setter<SuggestionData>
@@ -115,6 +118,8 @@ export function createGitHubEditorInstance(
     references: [],
     savedReplies: [],
   })
+  const [suggestedChangesConfig, setSuggestedChangesConfig] =
+    createSignal<SuggestedChangeConfig>()
 
   let injector: GitHubEditorInjector | null = null
   let disposeSwitch: (() => void) | null = null
@@ -168,6 +173,8 @@ export function createGitHubEditorInstance(
     setShowOldEditor,
     suggestionData,
     setSuggestionData,
+    suggestedChangesConfig,
+    setSuggestedChangesConfig,
     textareaRef,
     setTextareaRef(updater) {
       setTextareaRef(updater)

package.json

@@ -80,6 +80,7 @@
     "remark-parse": "catalog:",
     "remark-rehype": "catalog:",
     "remark-stringify": "catalog:",
+    "shiki": "^3.20.0",
     "solid-codemirror": "^2.3.1",
     "solid-confetti-explosion": "^1.1.8",
     "solid-js": "catalog:",