Make Abbreve a chrome extension

[Njong392]

This idea is fully formed yet, but I'm hoping that it goes somewhere. Let's share ideas and collab maybe?

[the-lazy-learner]

Also please add support for Firefox, or let me know if you need help with that

[Njong392]

I haven't really put thought into the idea because well... I don't know haha. And I don't know if my program will allow me to get into this right now. I will consider this, however. Thanks for the input.

[haddercone]

HI @Njong392 , thanks for your reply on #373.

I actually succeeded to create an extension out of the application and it was working the way I expected it to.
The only caveat was that the extension had the whole application in it.

The extension requires a manifest file configuration that needs a a HTML file. When we click on the extension, it shows that HTML file and it's content.

What I've learnt until now is that:

• we need to add build of the react application to create the extension.
• Since we can only one HTML file (index.html) in the build, the extension contains the whole application inside of it.

Preview:

I'm thinking to add only the form section of the page.
It should look something like this:

But doing so, I had to replace App to Form component in main.jsx. Which totally destroys the application.

Another approach I came up with is to create a different repository for the extension and get rid of the unwanted conponents ( like hero, navabr, footer and loadingSpinner component) from the application.

If you think that we should go ahead with the above approach , I would love to work on it.

If anyone has any other ideas to integrate the extension within the application itself without breaking it. i would love to here from you.

[JosiasAurel]

I have two proposals in mind right now for the extension.

1. We have a form (just like in your second screenshot) where users can enter the abbreviation and it will fetch from abbreve -- I believe it has a server but correct me if I'm wrong. Again in this situation, pure HTML, CSS and JS will do just fine imo since it's not complex.
2. The second approach I think will reduce the friction of having to click the extension. In this approach, we inject a "define with abbreve" (or something of the sort) when we right click the selected text. The extension could open a tooltip with the fetched abbreviation or a window.

here's in a example of how I anticipate the injected abbreve will look like (take not of Quill which is the extension)

[Njong392]

Hey @JosiasAurel thank you for your contribution to the discussion! As per the first option, I think it'll get a little complex because right now I am figuring out a way to migrate the system we have to a proper database. I know it'll somehow affect the complexity. Can we still make it work? I dunno yet.

I think your second explanation makes a lot more sense, and just makes things a lot easier. I did have the idea of trying to make it work like Grammarly, but I am glad you've brought it up better. I hope we keep adding good ideas to this discussion 🤌

[joel-wlf]

I actually created one without knowing this feed exist 😂

https://github.com/joel-wlf/Abbreve-chrome-extension

Maybe someone could add Firefox support...

[joel-wlf]

I also thought about a context menu option to be able to right click abbreviations and translate them (Maybe even on the website itself).

[mathiasayivor]

imo, most users looking up definitions are mobile users. Making this an extension would prevent them from accessing the app

[joel-wlf]

Isn't the extension completely separate from the potential App?

[Njong392]

I'm getting lost here for real hahaha. Is an extension separate from the app? Because I really see no way it'll bother mobile users

[joel-wlf]

fr

[mathiasayivor]

If the goal is to make an extension whiles still maintaining the web version, that'll work. I thought the plan is to replace the web version with extensions (hence my comment); Perhaps I read the description wrong.

[Njong392]

This means then that we need to set up a whole new project for it... Whoa.

[Njong392]

imo, most users looking up definitions are mobile users. Making this an extension would prevent them from accessing the app

Ehm... In my mind it would be like coming across an aabbreviation while working on the web or wherever, and then quickly looking it up through the extension.