unread lines

src/webpage/channel.ts

@@ -394,10 +394,14 @@ class Channel extends SnowFlake {
 		return this.owner.info;
 	}
 	readStateInfo(json: readyjson["d"]["read_state"]["entries"][0]) {
+		const next = this.messages.get(this.idToNext.get(this.lastreadmessageid as string) as string);
 		this.lastreadmessageid = json.last_message_id;
 		this.mentions = json.mention_count;
 		this.mentions ??= 0;
 		this.lastpin = json.last_pin_timestamp;
+		if (next) {
+			next.generateMessage();
+		}
 	}
 	get hasunreads(): boolean {
 		if (!this.hasPermission("VIEW_CHANNEL")) {
@@ -699,9 +703,13 @@ class Channel extends SnowFlake {
 			headers: this.headers,
 			body: JSON.stringify({}),
 		});
+		const next = this.messages.get(this.idToNext.get(this.lastreadmessageid as string) as string);
 		this.lastreadmessageid = this.lastmessageid;
 		this.guild.unreads();
 		this.unreads();
+		if (next) {
+			next.generateMessage();
+		}
 	}
 
 	coatDropDiv(div: HTMLDivElement, container: HTMLElement | boolean = false) {
@@ -1509,7 +1517,11 @@ class Channel extends SnowFlake {
 		this.lastmessageid = messagez.id;
 
 		if (messagez.author === this.localuser.user) {
+			const next = this.messages.get(this.idToNext.get(this.lastreadmessageid as string) as string);
 			this.lastreadmessageid = messagez.id;
+			if (next) {
+				next.generateMessage();
+			}
 		}
 		this.unreads();
 		this.guild.unreads();

src/webpage/message.ts

@@ -405,15 +405,26 @@ class Message extends SnowFlake {
 		const build = document.createElement("div");
 
 		build.classList.add("flexltr", "message");
-		if (premessage && !dupe) {
+
+		const unreadLine = premessage && premessage.id === this.channel.lastreadmessageid;
+		if ((premessage || unreadLine) && !dupe) {
+			let datelineNeeded: boolean;
 			const thisTime = new Date(this.getUnixTime());
+			if (premessage && !unreadLine) {
 				const prevTime = new Date(premessage.getUnixTime());
-			const datelineNeeded =
+				datelineNeeded =
 					thisTime.getDay() !== prevTime.getDay() ||
 					thisTime.getMonth() !== prevTime.getMonth() ||
 					thisTime.getFullYear() !== prevTime.getFullYear();
+			} else {
+				console.warn(div);
+				datelineNeeded = true;
+			}
 			if (datelineNeeded) {
 				const dateline = document.createElement("div");
+				if (unreadLine) {
+					dateline.classList.add("unreadDateline");
+				}
 				dateline.classList.add("flexltr", "dateline");
 				dateline.append(document.createElement("hr"));
 				const span = document.createElement("span");

src/webpage/style.css

@@ -827,7 +827,12 @@ span.instanceStatus {
 	padding: 4px 0;
 	font-size: 0.9rem;
 }
-
+.unreadDateline{
+	color:var(--red);
+	hr{
+		background:var(--red);
+	}
+}
 /* Member Info (DM/Member List) */
 .liststyle {
 	padding: 4px 8px;