diff --git a/src/components/CodeiumEditor/CodeiumEditor.tsx b/src/components/CodeiumEditor/CodeiumEditor.tsx index 3266d3c..5aab388 100644 --- a/src/components/CodeiumEditor/CodeiumEditor.tsx +++ b/src/components/CodeiumEditor/CodeiumEditor.tsx @@ -12,6 +12,7 @@ import { LanguageServerService } from '../../api/proto/exa/language_server_pb/la import { InlineCompletionProvider } from './InlineCompletionProvider'; import { CodeiumLogo } from '../CodeiumLogo/CodeiumLogo'; import { Document } from '../../models'; +import { deepMerge } from '../../utils/merge'; export interface CodeiumEditorProps extends EditorProps { language: string; @@ -184,26 +185,28 @@ export const CodeiumEditor: React.FC = ({ width={layout.width} height={layout.height} onMount={handleEditorDidMount} - options={{ - scrollBeyondLastColumn: 0, - scrollbar: { - alwaysConsumeMouseWheel: false, + options={deepMerge( + props.options, + { + scrollBeyondLastColumn: 0, + scrollbar: { + alwaysConsumeMouseWheel: false, + }, + codeLens: false, + // for resizing, but apparently might have "severe performance impact" + // automaticLayout: true, + minimap: { + enabled: false, + }, + quickSuggestions: false, + folding: false, + foldingHighlight: false, + foldingImportsByDefault: false, + links: false, + fontSize: 14, + wordWrap: 'on', }, - codeLens: false, - // for resizing, but apparently might have "severe performance impact" - // automaticLayout: true, - minimap: { - enabled: false, - }, - quickSuggestions: false, - folding: false, - foldingHighlight: false, - foldingImportsByDefault: false, - links: false, - fontSize: 14, - wordWrap: 'on', - ...props.options, - }} + )} /> ); diff --git a/src/stories/CodeiumEditor.stories.tsx b/src/stories/CodeiumEditor.stories.tsx index 717f6e8..2d78b7d 100644 --- a/src/stories/CodeiumEditor.stories.tsx +++ b/src/stories/CodeiumEditor.stories.tsx @@ -167,6 +167,11 @@ export const MultiFileContext: Story = { args: { ...baseParams, language: 'javascript', + options: { + scrollbar: { + vertical: 'hidden', + }, + }, value: `// You have context over a sample HTML page. // Codeium's generation will take this context into account when suggesting. diff --git a/src/utils/merge.ts b/src/utils/merge.ts new file mode 100644 index 0000000..df87541 --- /dev/null +++ b/src/utils/merge.ts @@ -0,0 +1,31 @@ +/** + * Merges a partial object with a fallback object, deeply combining the two. + * + * @param {Partial} partial - the partial object to merge (can be undefined) + * @param {T} fallback - the fallback object to merge with + * @return {T} the merged object + */ +export function deepMerge(partial: Partial | undefined, fallback: T): T { + const merged: any = { ...fallback }; + + for (const key in partial) { + if (typeof partial[key] === 'object' && !Array.isArray(partial[key])) { + if ( + fallback[key] && + typeof fallback[key] === 'object' && + !Array.isArray(fallback[key]) + ) { + merged[key] = deepMerge( + partial[key] as Partial | undefined, + fallback[key] as T, + ); + } else { + merged[key] = { ...partial[key] }; + } + } else { + merged[key] = partial[key]; + } + } + + return merged; +}