How to use firebase storage as backend to send/receive images?

[rrpuente]

Good day, I read every doc I found, but I couldn't figure out how to use firebase storage as backend to send/receive images. Is it possible in the current version?
I saw about writing a backend api for any type of files, but that is not an option for me, I have to use firebase storage as backend.

Thanks in advance.

[rpaschoal]

Hi @rrpuente ,

I don't have any examples of how you would achieve an integration with firebase but I am confident you could write a custom adapter for that.

The examples that I have in place with this library can be found here, hopefully they'll be helpful with what you're trying to achieve:

https://github.com/rpaschoal/ng-chat-netcoreapp
https://github.com/rpaschoal/ng-chat-nodejs

[rrpuente]

Good day @rpaschoal, first of all, thanks for your reply and also for this awesome product you've made public. I'm using it in a new development and I plan to keep using it.
Indeed I created a custom adapter for firebase, and the images or files can be uploaded to firestore, the issue is that the image is not displayed in the chat window, it just shows a link to a file instead of the image itself.
Is there any way to show the image as part of the messages in the chat window?
Thanks again!

[rpaschoal]

There is no images to thumbnail previews implemented at this stage @rrpuente so the answer is no.

All there is in place at this stage is a linkify pipe that transforms text URLs to links.

[rpaschoal]

@rrpuente would you be keen on contributing and implementing this one?

The only changes I am planning on implementing at this stage as I am quite busy with other projects are:

• Planning on refactoring some of the code to break it down to smaller components as the Angular chat component itself is quite big at this stage.
• Issue Styles for dark/light theme are leaking to other components #130

[rrpuente]

Yes, Im willing to do it.
I just need some guidance, it will be my first time.

[rpaschoal]

Awesome @rrpuente ,

I think it might be prudent to wait for the changes I am working on right now. I am refactoring the internals and splitting the friends list and chat items to their own components. It will be easier to manage things that way.

I've already started pushing the changes on branch 3.0.1. Here's the work in progress pull request if you want to track it: #156

[rrpuente]

great, Ill do that.

[rpaschoal]

@rrpuente The changes were released and merged for 3.0.1. It should be much easier to manage what happens on a chat window as the visuals were moved into a separate Angular component.

I will be closing this pull request as the original topic had nothing to do with image thumbnail previews. Please feel free to open a new issue so we can track how you could implement and push a pull request for this.

In regards to firebase, there is no plan from my side to add an example of how to integrate ng-chat with it. The existing examples should be enough to showcase how the chat adapters can be implemented.

Thanks!

[rrpuente]

@rpaschoal
Noted.
I implemented the firebase adapter before asking for the image/thumbnail story.
thanks!

[Interscope19]

@rrpuente can u share ur code implementation about firebase to get an idea :(?

[rrpuente]

Hi @Interscope19, the code I wrote was merged. If you search through the published code you will find it. However, if you cannot find it let me know.