Skip to content

Commit

Permalink
fixed bug & created own firebase
Browse files Browse the repository at this point in the history
  • Loading branch information
@Kakar21
Kakar21 committed Sep 19, 2024
1 parent 9bf74de commit 945fc46
Show file tree
Hide file tree
Showing 13 changed files with 77 additions and 75 deletions.
15 changes: 8 additions & 7 deletions src/app/app.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,14 @@ import { getDatabase, provideDatabase } from "@angular/fire/database";
import { getStorage, provideStorage } from "@angular/fire/storage";

export const firebaseConfig = {
apiKey: "AIzaSyD7uqij9obVTjDRwVKQzXxmXq2UJvD4S8c",
authDomain: "dabubble-2a68b.firebaseapp.com",
projectId: "dabubble-2a68b",
storageBucket: "dabubble-2a68b.appspot.com",
messagingSenderId: "274484134544",
appId: "1:274484134544:web:330557e6aa3cbe735a0e15"
};
apiKey: "AIzaSyB5LI6OKON58XLPG2G-N6dWAR9ROcDkq8Q",
authDomain: "dabubble-aaa9e.firebaseapp.com",
databaseURL: "https://dabubble-aaa9e-default-rtdb.europe-west1.firebasedatabase.app",
projectId: "dabubble-aaa9e",
storageBucket: "dabubble-aaa9e.appspot.com",
messagingSenderId: "564819078942",
appId: "1:564819078942:web:4c389300cb1264f959e30f"
};

export const appConfig: ApplicationConfig = {
providers: [
Expand Down
4 changes: 2 additions & 2 deletions .../dialogs/dialog-edit-profile-edit-profile/dialog-edit-profile-edit-profile.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<img src="assets/img/icons/close.svg" />
</button>
</div>
<div class="image-section" [ngClass]="{'not-guest': currentUserUid !== 'mMqjWie0OWa6lWCnq5hStLQqXow1'}" (click)="onAvatarClick()">
<div class="image-section" [ngClass]="{'not-guest': !firestore.isUserGuest(currentUserUid)}" (click)="onAvatarClick()">
<input type="file" #avatarInput style="display: none;" (change)="onFileSelected($event)" accept="image/*" />
@if (currentUser.avatar.length > 1) {
<img src="{{ currentUser.avatar }}" />
Expand All @@ -26,7 +26,7 @@
<div class="profile-name-container">
<div class="profile-name-section">
<h1>{{ currentUser.name }}</h1>
@if (currentUserUid !== "mMqjWie0OWa6lWCnq5hStLQqXow1") {
@if (!firestore.isUserGuest(currentUserUid)) {
<span (click)="editProfile()">Bearbeiten</span>
}
</div>
Expand Down
4 changes: 2 additions & 2 deletions ...ts/dialogs/dialog-edit-profile-edit-profile/dialog-edit-profile-edit-profile.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export class DialogEditProfileEditProfileComponent {
constructor(
public dialogRef: MatDialogRef<DialogEditProfileEditProfileComponent>,
public dialog: MatDialog,
private firestore: FirestoreService,
public firestore: FirestoreService,
private imageService: ImageService
) {
this.firestore.currentUser$.subscribe((uid) => {
Expand Down Expand Up @@ -171,7 +171,7 @@ export class DialogEditProfileEditProfileComponent {


onAvatarClick() {
if (this.currentUserUid !== "mMqjWie0OWa6lWCnq5hStLQqXow1") {
if (!this.firestore.isUserGuest(this.currentUserUid)) {
this.avatarInput.nativeElement.click();
}
}
Expand Down
1 change: 1 addition & 0 deletions src/app/components/dialogs/pofile-info-card/pofile-info-card.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ export class PofileInfoCardComponent {
openDM(user: UsersList) {
this.dialogRef.close();
this.chatService.setComponent("directMessage");
this.chatService.openedComponent.next('directMessage');
this.DMservice.getMessages(user.id);
this.chatService.openDirectMessage(user.id);
}
Expand Down
1 change: 1 addition & 0 deletions src/app/components/main/chat/chat.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -160,6 +160,7 @@
border: 2px solid white;
background-color: var(--bg-color);
margin-left: -0.625rem;
object-fit: cover;
}
}

Expand Down
1 change: 0 additions & 1 deletion src/app/components/main/chat/chat.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,6 @@ export class ChatComponent implements AfterViewInit, OnInit {
openProfileById(userId: string) {
const user = this.chatService.usersList.find((u) => u.id === userId);
if (user) {
console.log(user);
this.dialog.open(PofileInfoCardComponent, { data: user });
}
}
Expand Down
12 changes: 7 additions & 5 deletions src/app/components/main/conversations/conversations.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,8 @@ <h2>Devspace</h2>
(click)="
chatService.setComponent('newMessage');
chatService.selectedChannel = '';
chatService.selectedDirectmessage = ''
chatService.selectedDirectmessage = '';
closeThread();
"
class="new-message"
mat-icon-button
Expand All @@ -34,7 +35,7 @@ <h3>Channels</h3>
<button
mat-icon-button
class="add"
(click)="openDialog($event)"
(click)="openDialog($event); closeThread()"
>
<img src="assets/img/icons/add.svg" />
</button>
Expand Down Expand Up @@ -67,7 +68,7 @@ <h3>{{ channel.channelData.name }}</h3>
}
<div
class="new-channel"
(click)="openDialog($event)"
(click)="openDialog($event); closeThread();"
>
<img src="assets/img/icons/add_circle.svg" />
<span>Channel hinzufügen</span>
Expand Down Expand Up @@ -100,10 +101,11 @@ <h3>Direktnachrichten</h3>
<mat-button-toggle
class="contact"
(click)="
DMservice.getMessages(user.id);
chatService.openDirectMessage(user.id);
chatService.setComponent('directMessage');
chatService.openedComponent.next('directMessage');
DMservice.getMessages(user.id);
chatService.openDirectMessage(user.id)
closeThread();
"
[value]="user.id"
>
Expand Down
7 changes: 1 addition & 6 deletions src/app/components/main/main.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,9 +37,7 @@
mode="side"
>
<app-thread
[channelId]="chatService.currentChannelID"
[messageId]="selectedMessageId"
(threadClose)="closeThread()" [initialMessage]="initialMessage"
(threadClose)="closeThread()"
></app-thread>
</mat-drawer>
</mat-drawer-container>
Expand Down Expand Up @@ -70,9 +68,6 @@
}
@case ("thread") {
<app-thread
[channelId]="chatService.currentChannelID"
[messageId]="selectedMessageId"
[initialMessage]="initialMessage"
></app-thread>
}
@case ("directmessage") {
Expand Down
11 changes: 5 additions & 6 deletions src/app/components/main/main.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { DirectMessageComponent } from "./direct-message/direct-message.componen
import { NewMessageComponent } from "./new-message/new-message.component";
import { ChatService } from "../../shared/chat.service";
import { MatButtonModule } from "@angular/material/button";
import { EMPTY_MESSAGE, Message } from "../../interfaces/message";
import { ThreadService } from "../../shared/thread.service";

@Component({
selector: "app-main",
Expand All @@ -37,13 +37,11 @@ import { EMPTY_MESSAGE, Message } from "../../interfaces/message";
})
export class MainComponent {
@ViewChild("threadDrawer") public threadDrawer!: MatDrawer;
initialMessage: Message = EMPTY_MESSAGE;
threadOpen = false;
showMenu = false;
selectedMessageId!: string;


constructor(public chatService: ChatService) { }
constructor(public chatService: ChatService, private threadService: ThreadService) { }


mobileGoBack() {
Expand All @@ -62,9 +60,10 @@ export class MainComponent {


openThread(event: { channelId: string; messageId: string; }) {
this.selectedMessageId = event.messageId;
this.threadService.selectedMessageId = event.messageId;
if (!window.matchMedia("(max-width: 768px)").matches) {
this.threadDrawer.open();
this.threadService.openThread();
}

this.loadInitialMessage(event.channelId, event.messageId);
Expand All @@ -74,7 +73,7 @@ export class MainComponent {
loadInitialMessage(channelId: string, messageId: string) {
this.chatService.observeMessage(channelId, messageId).subscribe((message) => {
if (message) {
this.initialMessage = message;
this.threadService.initialMessage = message;
}
});
}
Expand Down
34 changes: 17 additions & 17 deletions src/app/components/main/thread/thread.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,43 +13,43 @@ <h1>Thread</h1>
</header>
<div class="chat-body">
<div class="chat">
<div class="message initialMessage" [ngClass]="{ 'my-message': initialMessage.id === currentUser.currentUser.id }">
<div class="message initialMessage" [ngClass]="{ 'my-message': threadService.initialMessage.id === currentUser.currentUser.id }">
<div class="hoverMenu">
<button class="emoji-button" mat-icon-button (click)="togglePicker('reaction', initialMessage.padNumber, $event, true); $event.stopPropagation()">
<button class="emoji-button" mat-icon-button (click)="togglePicker('reaction', threadService.initialMessage.padNumber, $event, true); $event.stopPropagation()">
<img src="assets/img/icons/add_reaction.svg" alt="Add reaction" />
</button>
<ng-container *ngIf="initialMessage.id === currentUser.currentUser.id">
<ng-container *ngIf="threadService.initialMessage.id === currentUser.currentUser.id">
<button mat-icon-button class="moreButton" [matMenuTriggerFor]="menu">
<img src="assets/img/icons/3-dots.svg" alt="More" />
</button>
<mat-menu class="moreMenu" #menu="matMenu">
<button mat-menu-item
(click)="openDialogEditMessage(initialMessage.padNumber.toString(), initialMessage.message)">
(click)="openDialogEditMessage(threadService.initialMessage.padNumber.toString(), threadService.initialMessage.message)">
Nachricht bearbeiten
</button>
</mat-menu>
</ng-container>
</div>
<img *ngIf="initialMessage.avatar.length > 1; else defaultAvatar" [src]="initialMessage.avatar" />
<img *ngIf="threadService.initialMessage.avatar.length > 1; else defaultAvatar" [src]="threadService.initialMessage.avatar" />
<ng-template #defaultAvatar>
<img src="assets/img/avatar/{{ initialMessage.avatar }}.svg"/>
<img src="assets/img/avatar/{{ threadService.initialMessage.avatar }}.svg"/>
</ng-template>
<div>
<div class="message-info">
<h5 (click)="openProfileById(initialMessage.id)">{{ initialMessage.name }}</h5>
<span>{{ commonFnService.dayTime(initialMessage.time) }} Uhr</span>
<h5 (click)="openProfileById(threadService.initialMessage.id)">{{ threadService.initialMessage.name }}</h5>
<span>{{ commonFnService.dayTime(threadService.initialMessage.time) }} Uhr</span>
</div>
<div class="message-text" [ngStyle]="{ 'display': initialMessage.message.trim() === '' ? 'none' : 'block' }"
[ngClass]="{'current-user-text': initialMessage.name === currentUser.currentUser.name}" (click)="commonFnService.onMessageClick($event)"
[innerHTML]="initialMessage.message | highlightMentions">
<div class="message-text" [ngStyle]="{ 'display': threadService.initialMessage.message.trim() === '' ? 'none' : 'block' }"
[ngClass]="{'current-user-text': threadService.initialMessage.name === currentUser.currentUser.name}" (click)="commonFnService.onMessageClick($event)"
[innerHTML]="threadService.initialMessage.message | highlightMentions">


</div>
<img *ngIf="initialMessage.imageUrl" class="loaded-img" [src]="initialMessage.imageUrl" (click)="openDialogImage(initialMessage.imageUrl)">
<div *ngIf="!commonFnService.noReactions(initialMessage)">
<img *ngIf="threadService.initialMessage.imageUrl" class="loaded-img" [src]="threadService.initialMessage.imageUrl" (click)="openDialogImage(threadService.initialMessage.imageUrl)">
<div *ngIf="!commonFnService.noReactions(threadService.initialMessage)">
<div class="reaction">
@if (initialMessage.reactions) {
@for (reaction of initialMessage.reactions| keyvalue;track reaction;let i = $index) {
@if (threadService.initialMessage.reactions) {
@for (reaction of threadService.initialMessage.reactions| keyvalue;track reaction;let i = $index) {
<div class="reaction-wrapper">
<div class="reaction-tooltip">
<span>{{reaction.key}}</span>
Expand All @@ -72,7 +72,7 @@ <h5 (click)="openProfileById(initialMessage.id)">{{ initialMessage.name }}</h5>
}
</div>
</div>
<button mat-raised-button (click)="addOrSubReactionInitial(initialMessage, reaction.key)">
<button mat-raised-button (click)="addOrSubReactionInitial(threadService.initialMessage, reaction.key)">
<ngx-emoji [emoji]="reaction.key"></ngx-emoji>
<span>{{reaction.key}}</span>
<p>{{reaction.value.count}}</p>
Expand All @@ -81,7 +81,7 @@ <h5 (click)="openProfileById(initialMessage.id)">{{ initialMessage.name }}</h5>
}
}
<button class="emoji-button" mat-icon-button (click)="
togglePicker('reaction', initialMessage.padNumber, $event, true);
togglePicker('reaction', threadService.initialMessage.padNumber, $event, true);
$event.stopPropagation()">
<img src="assets/img/icons/add_reaction.svg" alt="Add reaction" />
</button>
Expand Down
39 changes: 15 additions & 24 deletions src/app/components/main/thread/thread.component.ts
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { CommonModule } from "@angular/common";
import { Component, EventEmitter, Output, Input, OnChanges, SimpleChanges, HostListener, ViewChild, ElementRef } from "@angular/core";
import { Component, EventEmitter, Output, HostListener, ViewChild, ElementRef } from "@angular/core";
import { MatButtonModule } from "@angular/material/button";
import { RouterModule } from "@angular/router";
import { ChatService } from "../../../shared/chat.service";
Expand Down Expand Up @@ -39,10 +39,7 @@ import { CommonFnService } from "../../../shared/common-fn.service";
templateUrl: "./thread.component.html",
styleUrls: ["./thread.component.scss"],
})
export class ThreadComponent implements OnChanges {
@Input() channelId!: string;
@Input() messageId!: string;
@Input() initialMessage!: Message;
export class ThreadComponent {
@Output() threadClose = new EventEmitter<boolean>();
@ViewChild("messageInput") messageInput!: ElementRef<HTMLInputElement>;
messages: Message[] = [];
Expand All @@ -62,7 +59,7 @@ export class ThreadComponent implements OnChanges {
public chatService: ChatService,
public currentUser: CurrentuserService,
public dialog: MatDialog, // MatDialog injizieren
private threadService: ThreadService,
public threadService: ThreadService,
private imageService: ImageService,
public commonFnService: CommonFnService
) {
Expand All @@ -74,27 +71,21 @@ export class ThreadComponent implements OnChanges {


ngOnInit() {
if (this.channelId && this.messageId) {
this.threadService.threadOpened$.subscribe(() => {
this.loadMessages();
}
});

this.chatService.openedComponent.subscribe((component) => {
if (component === 'thread') {

setTimeout(() => {
this.messageInput.nativeElement.value = '';
this.messageInput.nativeElement.focus();
}, 100);
}
});
this.commonFnService.loadRecentEmojis();
}


ngOnChanges(changes: SimpleChanges) {
if ((changes["channelId"] && changes["channelId"].currentValue) || (changes["messageId"] && changes["messageId"].currentValue)) {
if (this.channelId && this.messageId) {
this.loadMessages();
}
}
this.commonFnService.loadRecentEmojis();
}


Expand All @@ -121,11 +112,11 @@ export class ThreadComponent implements OnChanges {


loadMessages() {
this.threadService.loadThreadMessages(this.channelId, this.messageId)
this.threadService.loadThreadMessages(this.chatService.currentChannelID, this.threadService.selectedMessageId)
.subscribe((messages) => {
this.messages = messages;
});
this.chatService.loadChannel(this.channelId);
this.chatService.loadChannel(this.chatService.currentChannelID);
}


Expand Down Expand Up @@ -169,7 +160,7 @@ export class ThreadComponent implements OnChanges {
imageUrl: imageUrl
};

await this.threadService.sendThreadMessage(this.channelId, this.messageId, message);
await this.threadService.sendThreadMessage(this.chatService.currentChannelID, this.threadService.selectedMessageId, message);
}


Expand Down Expand Up @@ -266,19 +257,19 @@ export class ThreadComponent implements OnChanges {
this.chatService.addReaction(messagePadnr, emoji, 'chat', '')
.catch((error) => console.error("Error adding reaction: ", error));
} else {
this.chatService.addReaction(this.messageId, emoji, 'thread', messagePadnr)
this.chatService.addReaction(this.threadService.selectedMessageId, emoji, 'thread', messagePadnr)
.catch((error) => console.error("Error adding reaction: ", error));
}
}


addOrSubReaction(message: any, reaction: any,) {
this.chatService.addOrSubReaction(message, reaction, 'thread', this.messageId);
this.chatService.addOrSubReaction(message, reaction, 'thread', this.threadService.selectedMessageId);
}


addOrSubReactionInitial(message: any, reaction: any) {
this.chatService.addOrSubReaction(message, reaction, 'chat', this.messageId);
this.chatService.addOrSubReaction(message, reaction, 'chat', this.threadService.selectedMessageId);
}


Expand All @@ -300,7 +291,7 @@ export class ThreadComponent implements OnChanges {
dialogRef.afterClosed().subscribe(result => {
if (result) {
const newContent = result;
this.threadService.updateThreadMessage(this.channelId, this.messageId, threadId, newContent)
this.threadService.updateThreadMessage(this.chatService.currentChannelID, this.threadService.selectedMessageId, threadId, newContent)
.catch(error => console.error('Error updating thread message:', error));
}
});
Expand Down
Loading

0 comments on commit 945fc46

Please sign in to comment.