|
setApiKey() {
// CreateUse OOUIa dialogsimpler for API keyOOUI inputMessageDialog usingapproach properinstead MediaWikiof inheritanceProcessDialog
const dialog = new ApiKeyDialogOO.ui.MessageDialog( this); ▼ function ApiKeyDialog(proofreader, config) {
ApiKeyDialog.super.call(this, config);
this.proofreader = proofreader; ▼
OO.inheritClass(ApiKeyDialog,const textInput = new OO.ui.ProcessDialog);TextInputWidget({
placeholder: 'Enter your Claude API Key...', ▼▲ value: this. proofreaderapiKey =|| proofreader;''
ApiKeyDialog.static.nameconst windowManager = 'ApiKeyDialog'new OO.ui.WindowManager();
$('body').append(windowManager.$element); ▼ ApiKeyDialog.static.title = 'Set Claude API Key';
ApiKeyDialogwindowManager.static.actions = addWindows([dialog]);
flags: ['primary', 'progressive'] ▼ action: 'cancel',
label: 'Cancel',
flags: ['safe']
}
];
ApiKeyDialogwindowManager.prototype.initialize = functionopenWindow()dialog, {
ApiKeyDialog.super.prototype.initialize.call(this);title: 'Set Claude API Key',
message: $('<div>').append(
this.textInput = new OO.ui.TextInputWidget({
▲ placeholder: 'Enter your Claude API Key...',
value: this.proofreader.apiKey || '' ▼
this.content = new OO.ui.PanelLayout({
expanded: false
});
this.content.$element.append(
$('<p>').text('Enter your Claude API Key to enable proofreading:'),
this.textInput.$element
);,
this.$body.append(this.content.$element);actions: [
}; {
action: 'save',
▲ action label: ' saveSave',
ApiKeyDialog.prototype.getActionProcess = function(action) {
if (action === flags: ['saveprimary'), {'progressive']
return new OO.ui.Process(() => {},
const key = this.textInput.getValue().trim();{
ifaction: (key) {'cancel',
label: this.proofreader.apiKey = key;'Cancel',
flags: localStorage.setItem(['claude_api_keysafe', this.proofreader.apiKey);]
this.proofreader.updateButtonVisibility();}
this.proofreader.updateStatus('API key set successfully!');
this}).closeclosed.then((data); => {
if (data && data.action === } else'save') {
const key = thistextInput.textInputgetValue().setValidityFlagtrim(false);
if return OO.ui.Process.static.createRejectProcess('Please enter a valid API key'); {
}this.apiKey = key;
} localStorage.setItem('claude_api_key', this.apiKey);
} else if (action === 'cancel') { this.updateButtonVisibility();
this.closeupdateStatus('API key set successfully!');
// FocusShow theerror textand inputreopen dialog▼ OO.ui.alert('Please enter a valid API key').then(() => {
▲ value: this. proofreader.apiKeysetApiKey(); // ||Reopen ''dialog
▲ flags: ['primary', 'progressive'] });
}
▲ // Clean up window padded: true,manager
return ApiKeyDialog.super.prototype.getActionProcess.call(this, action);
} windowManager.destroy();
// Focus the input after dialog opens
ApiKeyDialog.prototype.getSetupProcess = function(data) {
return ApiKeyDialog.super.prototype.getSetupProcess.call(this, data)
textInput.next(focus() => {;
}, this.actions.setMode('save'300);
▲ // Focus the text input
setTimeout(() => {
this.textInput.focus();
}, 100);
});
};
ApiKeyDialog.prototype.getReadyProcess = function(data) {
return ApiKeyDialog.super.prototype.getReadyProcess.call(this, data)
.next(() => {
this.textInput.focus();
});
};
▲ const dialog = new ApiKeyDialog(this);
const windowManager = new OO.ui.WindowManager();
▲ $('body').append(windowManager.$element);
windowManager.addWindows([dialog]);
windowManager.openWindow(dialog);
}
| 