Eliminar mensajes y archivos adjuntos
Presentación
Firebase Auth
Cloud Firestore
Cloud Storage
Cloud Functions
Curso Firebase para Web se encuentra en desarrollo. Vuelve pronto para encontrar nuevas lecciones.
- Primero debemos crear las acciones en el módulo
messages
para eliminar archivos desde Cloud Storage y luego el documento que representa el mensaje desde Cloud Firestore.
// Para los archivos adjuntos al mnensaje
async deleteFile(context, file) {
const fileRef = storage.refFromURL(file);
await fileRef.delete();
}
// Para el mensaje en sí
async deleteMessage(context, { roomID, messageID }) {
await db
.collection("rooms")
.doc(roomID)
.collection("messages")
.doc(messageID)
.delete();
},
- Ahora debemos consumir las acciones desde el componente local
ViewRoom
.
async deleteMessage(messageID) {
try {
await this.$store.dispatch("utils/requestConfirmation", {
props: { message: "¿Delete message?" },
component: "ConfirmationModal"
});
const message = this.messages.find(message => message.id === messageID);
if (message.photo) {
await this.$store.dispatch("messages/deleteFile", message.photo);
}
if (message.audio) {
await this.$store.dispatch("messages/deleteFile", message.audio);
}
await this.$store.dispatch("messages/deleteMessage", {
roomID: this.id,
messageID
});
this.$toast.success("Message deleted");
} catch (error) {
console.error(error.message);
this.$toast.error(error.message);
}
}
- Y añadir el botón necesario que sólo se muestra en nuestros propios mensajes.
<!-- Delete message -->
<a
href="#"
v-if="message.userId === $store.getters['user/getUserUid']"
@click="deleteMessage(message.id)"
class="message__delete is-pulled-right button is-small is-danger is-outlined"
>X</a
>
El primer headless CMS tanto para desarrolladores como para marketers. Pruébalo gratis.
¿Tienes alguna pregunta sobre esta lección de Curso Firebase para Web?
Resuelve todas tus dudas sobre Firebase en la Comunidad de Escuela Vue: un lugar donde participar, aprender y ayudar. ¡Te esperamos!.
Tras el registro (si no lo has hecho ya) serás redirigido/a al canal adecuado en la Comunidad.