#Firebase rich text handling in frontend regarding newlines (markdown)

5 messages · Page 1 of 1 (latest)

heavy quest
#

Hello everyone,
As we know Firebase saves strings as a single line (ASCII based) and "removes" newline characters indireclty. I encounter a problem with that since I want to save markdown text (rich text) in fields and render it in my Angular 17 application. I tried using a pipe which places \n or <br> breaks, where newlines existed before because I expect Firebase to save \n but in single line and ngx-markdown can't use it correctly.

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'newlineFormat',
  standalone: true,
})
export class NewlineFormatPipe implements PipeTransform {
  transform(value: string | undefined): string {
    if (!value) {
      return '';
    }
    return value.replaceAll(/\\n/g, '\n'); // Also tried with other combinations like \n etc.
  }
}
<markdown>{{ course.content | newlineFormat }}</markdown>

Has anyone ever encountered similar problems on how to fix this or is there a firebase utility for this?
Thanks for help! angular

white cypress
#

As we know Firebase saves strings as a single line
Err, no.

heavy quest
# white cypress > As we know Firebase saves strings as a single line Err, no.

Hey, with single line I mean...
Firestore obviously saves Texts, the way they're pasted to the API (AdminUI or Firestore Interface itself), but doesn't show the text in format in the backend nor replaces line breaks, etc. with formattings like \n or similar. With single line I mean the way it's displayed on the Firebase Interface. Sorry for the misunderstanding.

#

Here's the markdown that I get from Firestore that isn't formatted properly, while with custom or straight pasted markdown it works.

white cypress
#

The admin interface might have issues accepting or displaying line breaks, but strings storedusing the firestore API is stored as is. I use markdown in at least two projects with firestore, and there is no need to preprocess anything.