Remove uploaded app image

[PanderMusubi]

Is your feature request related to a problem? Please describe. Once an image is added to an app, it cannot be removed

Describe the solution you'd like A button to remove the uploaded image for an app, so that the default image appears again.

Describe alternatives you've considered Workaround is finding the original default app image and uploading that but that is too elaborate.

Additional context

[tessus]

If somebody takes care of the frontend stuff, I'll create a backend function and API endpoint DELETE /:id/image.

see #568

Update: The endpoint does exist now. If someone could work on the UI that would be great.

I suggest that there is an overlay image (an x) in the bottom right corner of the icon when hovered over the icon in the frontend. Upon click, the API is called. (The onclick js I can most likely do, but no idea how to do the overlay image.)

[ChlAtGitHub]

Please let me know if jQuery is available and provide an URL to let me test this out directly in the browser console. Then I will post the snippet. Thx, Chris.

[tessus]

It's typsescript and react - the 2 files that need changing are:

https://github.com/gotify/server/blob/master/ui/src/application/Applications.tsx

and

https://github.com/gotify/server/blob/master/ui/src/application/AppStore.ts (although I can do this one).

[xavier-GitHub76]

Hello @tessus

I began to update the ui (ui/src/application/Applications.tsx) I add a bouton (HighlightOffIcon)

For the moment, the click just write a trace in log :

(I'am a beginner, I have just create a first pull request today (https://github.com/gotify/server/pull/611))

[tessus]

Ah, nice. Is there a way to not use a separate column and icon, but create an overlay image when the mouse hovers over the icon? I am really bad with css and frontend stuff, but I have seen similar stuff in other UIs.

e.g. when you hover over an icon, the icon you used (or a simple X) is shown as an overlay (the uploade icon is shown a bit faded and the x icon on top - maybe even in the color red).

What do you think?

P.S.: If you give me access to your branch (after you created a PR for this), I can add the call to the API instead of the trace entries.

[jmattheis]

I prefer the hover behavior @tessus proposed.

[xavier-GitHub76]

For the moment, I'm not able to make this behavior, I'm a beginner and I don't know how to do. Sorry.

[tessus]

Hmm, can you point me to the code changes you made to Applications.tsx?

[xavier-GitHub76]

Hi, @tessus, I invite you to collaborate on my fork (I hope it's the good practice on Github) Regards

[tessus]

@xavier-GitHub76 thx. Yes, this is usually how it is done. Because now I can also add commits to any PRs you create from that specific fork.

However, I have noticed that you added the code changes to the PR that you have already created. It's better to create different PRs for different features/fixes/code_changes. But it depends on the project and the owner jmattheis. I thought you might have 2 different branches, while the one with the Applications.tsx changes has not been pushed. Woa, I just saw that you are working off your master branch.

You mentioned you are new to Github. I wrote a forum post for another project once on How to create a Pull Request (PR) Maybe it could be useful to you.