(null)
+
+ const accessor = useAccessor()
+ const instantiationService = accessor.get('IInstantiationService')
+ const modelService = accessor.get('IModelService')
+
+ return
+
+ instantiationService.createInstance(
+ CodeEditorWidget,
+ container,
+ {
+ automaticLayout: true,
+ wordWrap: 'on',
+ scrollbar: {
+ vertical: 'hidden',
+ horizontal: 'auto',
+ }
+ },
+ {
+ isSimpleWidget: true,
+ })
+ , [instantiationService])
+ }
+
+ onCreateInstance={useCallback((editor: CodeEditorWidget) => {
+
+ const model = modelService.createModel(initValue, null)
+ editor.setModel(model);
+ model.setLanguage(language ?? 'plaintext')
+
+ const container = editor.getDomNode()
+ const parentNode = container?.parentElement
+ if (parentNode)
+ parentNode.style.height = `${editor.getScrollHeight() + 1}px` // the +1 is if there's a half pixel issue
+
+ return []
+ }, [modelService, initValue, language])}
+
+ dispose={useCallback((editor: CodeEditorWidget) => {
+ editor.dispose();
+ }, [])}
+
+ // ignored
+ propsFn={useCallback(() => { return [] }, [])}
+
+ />
+
+
+}
+
+
// export const VoidScrollableElt = ({ options, children }: { options: ScrollableElementCreationOptions, children: React.ReactNode }) => {
// const instanceRef = useRef(null);
// const [childrenPortal, setChildrenPortal] = useState(null)
@@ -270,8 +335,6 @@ export const VoidSelectBox = ({ onChangeSelection, onCreateInstance, selectB
// options: readonly { text: string, value: T }[];
// onChangeSelection: (value: T) => void;
// }) => {
-// const contextViewProvider = useService('contextViewService');
-// const contextMenuProvider = useService('contextMenuService');
// return ({ onChangeSelection, onCreateInstance, selectB
// }) => {
// const containerRef = useRef(null);
-// const themeService = useService('themeService');
-// const contextViewService = useService('contextViewService');
-// const hoverService = useService('hoverService');
// useEffect(() => {
// if (!containerRef.current) return;
diff --git a/src/vs/workbench/contrib/void/browser/react/src/util/mountFnGenerator.tsx b/src/vs/workbench/contrib/void/browser/react/src/util/mountFnGenerator.tsx
index b674e7d5..78df4a21 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/util/mountFnGenerator.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/util/mountFnGenerator.tsx
@@ -6,15 +6,17 @@
import React, { useEffect, useState } from 'react';
import * as ReactDOM from 'react-dom/client'
import { _registerServices } from './services.js';
-import { ReactServicesType } from '../../../helpers/reactServicesHelper.js';
-export const mountFnGenerator = (Component: (params: any) => React.ReactNode) => (rootElement: HTMLElement, services: ReactServicesType, props?: any) => {
+
+import { ServicesAccessor } from '../../../../../../../editor/browser/editorExtensions.js';
+
+export const mountFnGenerator = (Component: (params: any) => React.ReactNode) => (rootElement: HTMLElement, accessor: ServicesAccessor, props?: any) => {
if (typeof document === 'undefined') {
console.error('index.tsx error: document was undefined')
return
}
- const disposables = _registerServices(services)
+ const disposables = _registerServices(accessor)
const root = ReactDOM.createRoot(rootElement)
diff --git a/src/vs/workbench/contrib/void/browser/react/src/util/services.tsx b/src/vs/workbench/contrib/void/browser/react/src/util/services.tsx
index 2cee2419..6404e108 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/util/services.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/util/services.tsx
@@ -3,11 +3,10 @@
* Void Editor additions licensed under the AGPL 3.0 License.
*--------------------------------------------------------------------------------------------*/
-import { useState, useEffect } from 'react'
+import React, { useState, useEffect } from 'react'
import { ThreadsState } from '../../../threadHistoryService.js'
import { RefreshableProviderName, SettingsOfProvider } from '../../../../../../../platform/void/common/voidSettingsTypes.js'
import { IDisposable } from '../../../../../../../base/common/lifecycle.js'
-import { ReactServicesType } from '../../../helpers/reactServicesHelper.js'
import { VoidSidebarState } from '../../../sidebarStateService.js'
import { VoidSettingsState } from '../../../../../../../platform/void/common/voidSettingsService.js'
import { ColorScheme } from '../../../../../../../platform/theme/common/theme.js'
@@ -15,9 +14,35 @@ import { VoidQuickEditState } from '../../../quickEditStateService.js'
import { RefreshModelStateOfProvider } from '../../../../../../../platform/void/common/refreshModelService.js'
-// normally to do this you'd use a useEffect that calls .onDidChangeState(), but useEffect mounts too late and misses initial state changes
-let services: ReactServicesType
+
+
+import { ServicesAccessor } from '../../../../../../../editor/browser/editorExtensions.js';
+import { IModelService } from '../../../../../../../editor/common/services/model.js';
+import { IClipboardService } from '../../../../../../../platform/clipboard/common/clipboardService.js';
+import { IContextViewService, IContextMenuService } from '../../../../../../../platform/contextview/browser/contextView.js';
+import { IFileService } from '../../../../../../../platform/files/common/files.js';
+import { IHoverService } from '../../../../../../../platform/hover/browser/hover.js';
+import { IThemeService } from '../../../../../../../platform/theme/common/themeService.js';
+import { ILLMMessageService } from '../../../../../../../platform/void/common/llmMessageService.js';
+import { IRefreshModelService } from '../../../../../../../platform/void/common/refreshModelService.js';
+import { IVoidSettingsService } from '../../../../../../../platform/void/common/voidSettingsService.js';
+import { IInlineDiffsService } from '../../../inlineDiffsService.js';
+import { IQuickEditStateService } from '../../../quickEditStateService.js';
+import { ISidebarStateService } from '../../../sidebarStateService.js';
+import { IThreadHistoryService } from '../../../threadHistoryService.js';
+import { IInstantiationService } from '../../../../../../../platform/instantiation/common/instantiation.js'
+import { ICodeEditorService } from '../../../../../../../editor/browser/services/codeEditorService.js'
+import { ICommandService } from '../../../../../../../platform/commands/common/commands.js'
+import { IContextKeyService } from '../../../../../../../platform/contextkey/common/contextkey.js'
+import { INotificationService } from '../../../../../../../platform/notification/common/notification.js'
+import { IAccessibilityService } from '../../../../../../../platform/accessibility/common/accessibility.js'
+import { ILanguageConfigurationService } from '../../../../../../../editor/common/languages/languageConfigurationRegistry.js'
+import { ILanguageFeaturesService } from '../../../../../../../editor/common/services/languageFeatures.js'
+
+
+
+// normally to do this you'd use a useEffect that calls .onDidChangeState(), but useEffect mounts too late and misses initial state changes
// even if React hasn't mounted yet, the variables are always updated to the latest state.
// React listens by adding a setState function to these listeners.
@@ -43,7 +68,7 @@ const colorThemeStateListeners: Set<(s: ColorScheme) => void> = new Set()
// must call this before you can use any of the hooks below
// this should only be called ONCE! this is the only place you don't need to dispose onDidChange. If you use state.onDidChange anywhere else, make sure to dispose it!
let wasCalled = false
-export const _registerServices = (services_: ReactServicesType) => {
+export const _registerServices = (accessor: ServicesAccessor) => {
const disposables: IDisposable[] = []
@@ -54,8 +79,18 @@ export const _registerServices = (services_: ReactServicesType) => {
}
wasCalled = true
- services = services_
- const { sidebarStateService, quickEditStateService, settingsStateService, threadsStateService, refreshModelService, themeService, } = services
+ _registerAccessor(accessor)
+
+ const stateServices = {
+ quickEditStateService: accessor.get(IQuickEditStateService),
+ sidebarStateService: accessor.get(ISidebarStateService),
+ threadsStateService: accessor.get(IThreadHistoryService),
+ settingsStateService: accessor.get(IVoidSettingsService),
+ refreshModelService: accessor.get(IRefreshModelService),
+ themeService: accessor.get(IThemeService),
+ }
+
+ const { sidebarStateService, quickEditStateService, settingsStateService, threadsStateService, refreshModelService, themeService, } = stateServices
quickEditState = quickEditStateService.state
disposables.push(
@@ -110,14 +145,56 @@ export const _registerServices = (services_: ReactServicesType) => {
}
-// -- services --
-export const useService = (serviceName: T): ReactServicesType[T] => {
- if (services === null) {
- throw new Error('useAccessor must be used within an AccessorProvider')
- }
- return services[serviceName]
+const getReactAccessor = (accessor: ServicesAccessor) => {
+ const reactAccessor = {
+ IModelService: accessor.get(IModelService),
+ IClipboardService: accessor.get(IClipboardService),
+ IContextViewService: accessor.get(IContextViewService),
+ IContextMenuService: accessor.get(IContextMenuService),
+ IFileService: accessor.get(IFileService),
+ IHoverService: accessor.get(IHoverService),
+ IThemeService: accessor.get(IThemeService),
+ ILLMMessageService: accessor.get(ILLMMessageService),
+ IRefreshModelService: accessor.get(IRefreshModelService),
+ IVoidSettingsService: accessor.get(IVoidSettingsService),
+ IInlineDiffsService: accessor.get(IInlineDiffsService),
+ IQuickEditStateService: accessor.get(IQuickEditStateService),
+ ISidebarStateService: accessor.get(ISidebarStateService),
+ IThreadHistoryService: accessor.get(IThreadHistoryService),
+
+ IInstantiationService: accessor.get(IInstantiationService),
+ ICodeEditorService: accessor.get(ICodeEditorService),
+ ICommandService: accessor.get(ICommandService),
+ IContextKeyService: accessor.get(IContextKeyService),
+ INotificationService: accessor.get(INotificationService),
+ IAccessibilityService: accessor.get(IAccessibilityService),
+ ILanguageConfigurationService: accessor.get(ILanguageConfigurationService),
+ ILanguageFeaturesService: accessor.get(ILanguageFeaturesService),
+
+ } as const
+ return reactAccessor
}
+type ReactAccessor = ReturnType
+
+
+let reactAccessor_: ReactAccessor | null = null
+const _registerAccessor = (accessor: ServicesAccessor) => {
+ const reactAccessor = getReactAccessor(accessor)
+ reactAccessor_ = reactAccessor
+}
+
+// -- services --
+export const useAccessor = () => {
+ if (!reactAccessor_) {
+ throw new Error(`⚠️ Void useAccessor was called before _registerServices!`)
+ }
+
+ return { get: (service: S): ReactAccessor[S] => reactAccessor_![service] }
+}
+
+
+
// -- state of services --
export const useQuickEditState = () => {
diff --git a/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/ModelDropdown.tsx b/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/ModelDropdown.tsx
index 59abfcde..edb55f90 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/ModelDropdown.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/ModelDropdown.tsx
@@ -5,13 +5,15 @@
import { useCallback, useEffect, useRef, useState } from 'react'
import { FeatureName, featureNames, ModelSelection, modelSelectionsEqual, ProviderName, providerNames } from '../../../../../../../platform/void/common/voidSettingsTypes.js'
-import { useSettingsState, useRefreshModelState, useService } from '../util/services.js'
+import { useSettingsState, useRefreshModelState, useAccessor } from '../util/services.js'
import { VoidSelectBox } from '../util/inputs.js'
import { SelectBox } from '../../../../../../../base/browser/ui/selectBox/selectBox.js'
const ModelSelectBox = ({ featureName }: { featureName: FeatureName }) => {
- const voidSettingsService = useService('settingsStateService')
+ const accessor = useAccessor()
+
+ const voidSettingsService = accessor.get('IVoidSettingsService')
const settingsState = useSettingsState()
let weChangedText = false
diff --git a/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/Settings.tsx b/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/Settings.tsx
index cc00422e..f1d95780 100644
--- a/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/Settings.tsx
+++ b/src/vs/workbench/contrib/void/browser/react/src/void-settings-tsx/Settings.tsx
@@ -3,7 +3,7 @@ import { InputBox } from '../../../../../../../base/browser/ui/inputbox/inputBox
import { ProviderName, SettingName, displayInfoOfSettingName, providerNames, VoidModelInfo, featureFlagNames, displayInfoOfFeatureFlag, customSettingNamesOfProvider, RefreshableProviderName, refreshableProviderNames, displayInfoOfProviderName } from '../../../../../../../platform/void/common/voidSettingsTypes.js'
import ErrorBoundary from '../sidebar-tsx/ErrorBoundary.js'
import { VoidCheckBox, VoidInputBox, VoidSelectBox, VoidSwitch } from '../util/inputs.js'
-import { useIsDark, useRefreshModelListener, useRefreshModelState, useService, useSettingsState } from '../util/services.js'
+import { useAccessor, useIsDark, useRefreshModelListener, useRefreshModelState, useSettingsState } from '../util/services.js'
import { X, RefreshCw, Loader2, Check } from 'lucide-react'
import { ChatMarkdownRender } from '../markdown/ChatMarkdownRender.js'
@@ -12,7 +12,9 @@ import { ChatMarkdownRender } from '../markdown/ChatMarkdownRender.js'
// models
const RefreshModelButton = ({ providerName }: { providerName: RefreshableProviderName }) => {
const refreshModelState = useRefreshModelState()
- const refreshModelService = useService('refreshModelService')
+
+ const accessor = useAccessor()
+ const refreshModelService = accessor.get('IRefreshModelService')
const [justFinished, setJustSucceeded] = useState(false)
@@ -60,7 +62,10 @@ const RefreshableModels = () => {
const AddModelMenu = ({ onSubmit }: { onSubmit: () => void }) => {
- const settingsStateService = useService('settingsStateService')
+
+ const accessor = useAccessor()
+ const settingsStateService = accessor.get('IVoidSettingsService')
+
const settingsState = useSettingsState()
const providerNameRef = useRef(null)
@@ -147,7 +152,9 @@ const AddModelMenuFull = () => {
export const ModelDump = () => {
- const settingsStateService = useService('settingsStateService')
+ const accessor = useAccessor()
+ const settingsStateService = accessor.get('IVoidSettingsService')
+
const settingsState = useSettingsState()
// a dump of all the enabled providers' models
@@ -204,7 +211,9 @@ const ProviderSetting = ({ providerName, settingName }: { providerName: Provider
const { title: providerTitle, } = displayInfoOfProviderName(providerName)
const { title: settingTitle, placeholder, subTextMd } = displayInfoOfSettingName(providerName, settingName)
- const voidSettingsService = useService('settingsStateService')
+
+ const accessor = useAccessor()
+ const voidSettingsService = accessor.get('IVoidSettingsService')
let weChangedTextRef = false
@@ -243,7 +252,8 @@ const ProviderSetting = ({ providerName, settingName }: { providerName: Provider
const SettingsForProvider = ({ providerName }: { providerName: ProviderName }) => {
const voidSettingsState = useSettingsState()
- const voidSettingsService = useService('settingsStateService')
+ const accessor = useAccessor()
+ const voidSettingsService = accessor.get('IVoidSettingsService')
const { enabled } = voidSettingsState.settingsOfProvider[providerName]
const settingNames = customSettingNamesOfProvider(providerName)
@@ -286,7 +296,9 @@ export const VoidProviderSettings = () => {
export const VoidFeatureFlagSettings = () => {
- const voidSettingsService = useService('settingsStateService')
+ const accessor = useAccessor()
+ const voidSettingsService = accessor.get('IVoidSettingsService')
+
const voidSettingsState = useSettingsState()
return <>
diff --git a/src/vs/workbench/contrib/void/browser/sidebarPane.ts b/src/vs/workbench/contrib/void/browser/sidebarPane.ts
index bbe7cf4b..519a96c2 100644
--- a/src/vs/workbench/contrib/void/browser/sidebarPane.ts
+++ b/src/vs/workbench/contrib/void/browser/sidebarPane.ts
@@ -25,7 +25,7 @@ import { IViewPaneOptions, ViewPane } from '../../../browser/parts/views/viewPan
import { IContextKeyService } from '../../../../platform/contextkey/common/contextkey.js';
import { IInstantiationService } from '../../../../platform/instantiation/common/instantiation.js';
-import { IDisposable } from '../../../../base/common/lifecycle.js';
+// import { IDisposable } from '../../../../base/common/lifecycle.js';
import { IConfigurationService } from '../../../../platform/configuration/common/configuration.js';
import { IThemeService } from '../../../../platform/theme/common/themeService.js';
import { IContextMenuService } from '../../../../platform/contextview/browser/contextView.js';
@@ -33,16 +33,12 @@ import { IKeybindingService } from '../../../../platform/keybinding/common/keybi
import { IOpenerService } from '../../../../platform/opener/common/opener.js';
import { ITelemetryService } from '../../../../platform/telemetry/common/telemetry.js';
import { IHoverService } from '../../../../platform/hover/browser/hover.js';
-
import { mountSidebar } from './react/out/sidebar-tsx/index.js';
-import { getReactServices } from './helpers/reactServicesHelper.js';
import { Codicon } from '../../../../base/common/codicons.js';
import { Orientation } from '../../../../base/browser/ui/sash/sash.js';
-// import { Orientation } from '../../../../base/browser/ui/sash/sash.js';
-// import { Codicon } from '../../../../base/common/codicons.js';
-// import { Codicon } from '../../../../base/common/codicons.js';
-
+// import { IDisposable } from '../../../../base/common/lifecycle.js';
+import { IDisposable } from '../../../../base/common/lifecycle.js';
// compare against search.contribution.ts and debug.contribution.ts, scm.contribution.ts (source control)
@@ -62,6 +58,8 @@ class SidebarViewPane extends ViewPane {
@IOpenerService openerService: IOpenerService,
@ITelemetryService telemetryService: ITelemetryService,
@IHoverService hoverService: IHoverService,
+ // @ICodeEditorService private readonly editorService: ICodeEditorService,
+ // @IContextKeyService private readonly editorContextKeyService: IContextKeyService,
) {
super(options, keybindingService, contextMenuService, configurationService, contextKeyService, viewDescriptorService, instantiationService, openerService, themeService, telemetryService, hoverService)
@@ -76,10 +74,8 @@ class SidebarViewPane extends ViewPane {
// gets set immediately
this.instantiationService.invokeFunction(accessor => {
- const services = getReactServices(accessor)
-
// mount react
- const disposables: IDisposable[] | undefined = mountSidebar(parent, services);
+ const disposables: IDisposable[] | undefined = mountSidebar(parent, accessor);
disposables?.forEach(d => this._register(d))
});
}
@@ -88,8 +84,6 @@ class SidebarViewPane extends ViewPane {
super.layoutBody(height, width)
this.element.style.height = `${height}px`
this.element.style.width = `${width}px`
-
-
}
}