Added keyboard shortcut for displaying settings dialog.

[MathewtheCoder]

Fixes

...

Checks

• [ *] Ran npm run test-build

Changes proposed in this pull request:

• Add Command + , shortcut for accessing the settings #1006 Give users the ability to access settings dialog through the shortcut 'Cmd+,'

[welcome]

👋🏾Thanks for opening this pull request! Please check out our contributing guidelines.👊🏾😁

[imolorhe]

Hey, did you test the code? Looks like you have linting issues. Also shouldn't this be only in the electron app? This shortcut should open the Chrome or Firefox browser settings in the extensions and web apps right?

[imolorhe]

I just saw you also commented that you had similar doubts. So this should only work in the Mac electron app. For that, you'd need to update the menu.js in altair-electron with the preferences shortcut and also add an ipc event in the electron service

[imolorhe]

So what I mean for the implementation is,

In the menu.js, add a new item somewhere around here:

https://github.com/imolorhe/altair/blob/staging/packages/altair-electron/src/menu.js#L53

for "Preferences..." and set an accelerator: 'Cmd+,'. For more info, on that you can look at the electron docs for MenuItem

The actions for the menu items are defined here (as you can see it just sends an event to the app):

https://github.com/imolorhe/altair/blob/staging/packages/altair-electron/src/window.js#L23-L42

You define the ipc channel listeners here:

https://github.com/imolorhe/altair/blob/staging/src/app/services/electron-app/electron-app.service.ts#L69-L71

GitHub

imolorhe/altair

✨⚡️ A beautiful feature-rich GraphQL Client for all platforms. - imolorhe/altair

GitHub

imolorhe/altair

✨⚡️ A beautiful feature-rich GraphQL Client for all platforms. - imolorhe/altair

GitHub

imolorhe/altair

✨⚡️ A beautiful feature-rich GraphQL Client for all platforms. - imolorhe/altair

[imolorhe]

You would need to implement this on the electron app as I have described. Hopefully my description was clear and easy enough for you 🙂

[imolorhe]

Another helpful resource: https://dev.to/aurelkurtula/creating-a-text-editor-in-electron-part-3---setting-preferences-584h

The DEV Community

Creating a text editor in Electron: part 3 - Setting Preferences

[MathewtheCoder]

Thanks for the descriptive comments. I will look into it tonight.

[MathewtheCoder]

@imolorhe I have done the changes you had said and have removed the code for displaying the settings dialog on website. I was not able to run the electron app since I am quite new to electron app development. So please test the code and give feedback on how to improve the contribution.

[MathewtheCoder]

@imolorhe How do we launch electron app. I tried building it but its throwing error at end ? Can you clarify on how to launch the electron app.

[imolorhe]

You need to run yarn test-all in the base of the repo, than go into the altair-electron package directory and run yarn dev

[imolorhe]

Can you verify the changes before I merge them

[MathewtheCoder]

@imolorhe Yes i will verify the changes and update in PR.

[MathewtheCoder]

@imolorhe I have tested the electron app and it works as expected.
Menu Item

Settings Dialog

[imolorhe]

Nice! After the build passes, I'll merge. 🙂

[welcome]

Congrats on merging your first pull request! 🙌🏾🎉🎊