diff --git a/README.md b/README.md index 652f51d..e0a1260 100644 --- a/README.md +++ b/README.md @@ -72,12 +72,13 @@ The plugin has a few settings that you can configure: - **Output format**: Choose between JSON block or Obsidian variable. - **Request Method**: Choose between GET, POST, PUT & DELETE. - **Request Data**: The data to send with the request. Data should by in JSON format. +- **Header Data**: The header data to send with the request. Data should by in JSON format. (`{"Content-Type": "application/json", "Authorization": "Bearer TOKEN"}`) - **Response Data**: The response data to display. If empty all data will be display. You can use a right arrow `->` to access nested objects. For example, if you want to show the `title` from the `user` object, you can do that like this: `user -> title`. ## To-do - [x] Add more request types (POST, PUT, DELETE) -- [ ] ~Add support for authentication~ +- [ ] Add support for authentication - [x] Add customizability for modal output (e.g. show only specific fields, change color scheme, add custom CSS) - [x] Add customizability for variable output (e.g. show only specific fields, change variable name) diff --git a/main.ts b/main.ts index 1f6daa4..4841f0c 100644 --- a/main.ts +++ b/main.ts @@ -6,6 +6,7 @@ interface LoadAPIRSettings { FormatOut: string; MethodRequest: string; DataRequest: string; + HeaderRequest: string; DataResponse: string; URLs: string[]; Name: string; @@ -16,6 +17,7 @@ const DEFAULT_SETTINGS: LoadAPIRSettings = { FormatOut: 'json', MethodRequest: 'GET', DataRequest: '', + HeaderRequest: '{"Content-Type": "application/json"}', DataResponse: '', URLs: [], Name: '', @@ -87,7 +89,7 @@ export default class MainAPIR extends Plugin { id: 'show-response-in-modal', name: 'Show response in Modal', callback: () => { - new ShowOutputModal(this.app, this.settings.URL, this.settings.MethodRequest, this.settings.DataRequest, this.settings.DataResponse).open(); + new ShowOutputModal(this.app, this.settings.URL, this.settings.MethodRequest, this.settings.DataRequest, this.settings.HeaderRequest, this.settings.DataResponse).open(); } }); @@ -161,27 +163,27 @@ export default class MainAPIR extends Plugin { } class ShowOutputModal extends Modal { - constructor(app: App, URL: string, MethodRequest: string, DataRequest: string, DataResponse: string) { + constructor(app: App, URL: string, MethodRequest: string, DataRequest: string, HeaderRequest: string, DataResponse: string) { super(app); this.props = { URL, MethodRequest, DataRequest, + HeaderRequest, DataResponse, }; } onOpen() { const { contentEl } = this; - const { URL, MethodRequest, DataRequest, DataResponse } = this.props; + const { URL, MethodRequest, DataRequest, HeaderRequest, DataResponse } = this.props; + console.log(HeaderRequest) if (MethodRequest === "GET") { requestUrl({ url: URL, method: MethodRequest, - headers: { - 'Content-Type': 'application/json' - } + headers: JSON.parse(HeaderRequest) }) .then((data: JSON) => { if (DataResponse !== "") { @@ -205,9 +207,7 @@ onOpen() { requestUrl({ url: URL, method: MethodRequest, - headers: { - 'Content-Type': 'application/json' - }, + headers: JSON.parse(HeaderRequest), body: DataRequest }) .then((data: JSON) => { @@ -300,12 +300,22 @@ class APRSettings extends PluginSettingTab { .setName('Data to send') .setDesc("Data to send in the request") .addTextArea(text => text - .setPlaceholder('{"data": "data"}') + .setPlaceholder('{"data":"data"}') .setValue(this.plugin.settings.DataRequest) .onChange(async (value) => { this.plugin.settings.DataRequest = value; await this.plugin.saveSettings(); })); + new Setting(containerEl) + .setName('Headers') + .setDesc("Headers to send in the request") + .addTextArea(text => text + .setPlaceholder('{"Content-Type": "application/json"}') + .setValue(this.plugin.settings.HeaderRequest) + .onChange(async (value) => { + this.plugin.settings.HeaderRequest = value; + await this.plugin.saveSettings(); + })); new Setting(containerEl) .setName('Data to show in modal') .setDesc("Write the name of the variable to show in the modal (space by comma)") @@ -325,14 +335,15 @@ class APRSettings extends PluginSettingTab { new Notice("Name is empty"); return; } - const {URL, FormatOut, MethodRequest, DataResponse, DataRequest} = this.plugin.settings; + const {URL, FormatOut, MethodRequest, DataResponse, DataRequest, HeaderRequest} = this.plugin.settings; const {URLs} = this.plugin.settings; URLs.push({ 'URL': URL, 'Name': Name, 'FormatOut': FormatOut, 'MethodRequest': MethodRequest, - 'DataRequest': DataRequest, + 'DataRequest': DataRequest, + 'HeaderRequest': HeaderRequest, 'DataResponse': DataResponse }); await this.plugin.saveSettings();