diff --git a/backend/migrations/20220731050926-pins.js b/backend/migrations/20220731050926-pins.js
new file mode 100644
index 0000000..31d8387
--- /dev/null
+++ b/backend/migrations/20220731050926-pins.js
@@ -0,0 +1,42 @@
+"use strict"
+
+module.exports = {
+ async up(queryInterface, Sequelize) {
+ await queryInterface.createTable("Pins", {
+ id: {
+ type: Sequelize.BIGINT,
+ primaryKey: true,
+ autoIncrement: true
+ },
+ pinnedById: {
+ type: Sequelize.BIGINT,
+ allowNull: false
+ },
+ messageId: {
+ type: Sequelize.BIGINT,
+ allowNull: false
+ },
+ chatId: {
+ type: Sequelize.BIGINT,
+ allowNull: false
+ },
+ createdAt: {
+ type: Sequelize.DATE,
+ allowNull: false
+ },
+ updatedAt: {
+ type: Sequelize.DATE,
+ allowNull: false
+ }
+ })
+ },
+
+ async down(queryInterface, Sequelize) {
+ /**
+ * Add reverting commands here.
+ *
+ * Example:
+ * await queryInterface.dropTable('users');
+ */
+ }
+}
diff --git a/backend/models/messages.js b/backend/models/messages.js
index 3b89583..f082819 100644
--- a/backend/models/messages.js
+++ b/backend/models/messages.js
@@ -22,6 +22,10 @@ module.exports = (sequelize, DataTypes) => {
as: "attachments",
foreignKey: "messageId"
})
+ Message.hasMany(models.ChatAssociation, {
+ as: "readReceipts",
+ foreignKey: "lastRead"
+ })
}
}
Message.init(
diff --git a/backend/models/pins.js b/backend/models/pins.js
new file mode 100644
index 0000000..5c2bd20
--- /dev/null
+++ b/backend/models/pins.js
@@ -0,0 +1,51 @@
+"use strict"
+const { Model } = require("sequelize")
+module.exports = (sequelize, DataTypes) => {
+ class Pin extends Model {
+ /**
+ * Helper method for defining associations.
+ * This method is not a part of Sequelize lifecycle.
+ * The `models/index` file will call this method automatically.
+ */
+ static associate(models) {
+ Pin.belongsTo(models.User, {
+ as: "pinnedBy"
+ })
+ Pin.belongsTo(models.Message, {
+ as: "message"
+ })
+ Pin.belongsTo(models.Chat, {
+ as: "chat"
+ })
+ }
+ }
+ Pin.init(
+ {
+ pinnedById: {
+ type: DataTypes.BIGINT,
+ allowNull: false
+ },
+ messageId: {
+ type: DataTypes.BIGINT,
+ allowNull: false
+ },
+ chatId: {
+ type: DataTypes.BIGINT,
+ allowNull: false
+ },
+ createdAt: {
+ type: DataTypes.DATE,
+ allowNull: false
+ },
+ updatedAt: {
+ type: DataTypes.DATE,
+ allowNull: false
+ }
+ },
+ {
+ sequelize,
+ modelName: "Pin"
+ }
+ )
+ return Pin
+}
diff --git a/backend/routes/communications.js b/backend/routes/communications.js
index e4b416d..d40e27d 100644
--- a/backend/routes/communications.js
+++ b/backend/routes/communications.js
@@ -6,6 +6,7 @@ const {
User,
Chat,
ChatAssociation,
+ Pin,
Message,
Friend,
Attachment,
@@ -66,6 +67,18 @@ async function createMessage(req, type, content, association, userId) {
id: message.id
},
include: [
+ {
+ model: ChatAssociation,
+ as: "readReceipts",
+ attributes: ["id"],
+ include: [
+ {
+ model: User,
+ as: "user",
+ attributes: ["username", "name", "avatar", "id"]
+ }
+ ]
+ },
{
model: Attachment,
as: "attachments"
@@ -124,7 +137,6 @@ async function createMessage(req, type, content, association, userId) {
]
})
associations.forEach((user) => {
- console.log(user)
io.to(user.dataValues.userId).emit("message", {
...messageLookup.dataValues,
associationId: user.dataValues.id,
@@ -196,9 +208,7 @@ router.get("/", auth, async (req, res, next) => {
"id",
"createdAt",
"updatedAt",
-
"status",
-
"admin",
"status",
"bot"
@@ -468,6 +478,170 @@ router.get("/:id", auth, async (req, res, next) => {
}
})
+router.get("/:id/pins", auth, async (req, res, next) => {
+ try {
+ let chat = await ChatAssociation.findOne({
+ where: {
+ userId: req.user.id,
+ id: req.params.id
+ },
+ include: [
+ {
+ model: Chat,
+ as: "chat"
+ }
+ ]
+ })
+ if (chat) {
+ const pins = await Pin.findAll({
+ where: {
+ chatId: chat.chat.id
+ },
+ include: [
+ {
+ model: User,
+ as: "pinnedBy",
+ required: false,
+ attributes: [
+ "username",
+ "name",
+ "avatar",
+ "id",
+ "createdAt",
+ "updatedAt"
+ ],
+ include: [
+ {
+ model: Nickname,
+ as: "nickname",
+ attributes: ["nickname"],
+ required: false,
+ where: {
+ userId: req.user.id
+ }
+ }
+ ]
+ },
+ {
+ model: Message,
+ as: "message",
+ include: [
+ {
+ model: User,
+ as: "user",
+ attributes: [
+ "username",
+ "name",
+ "avatar",
+ "id",
+ "createdAt",
+ "updatedAt"
+ ],
+ include: [
+ {
+ model: Nickname,
+ as: "nickname",
+ attributes: ["nickname"],
+ required: false,
+ where: {
+ userId: req.user.id
+ }
+ }
+ ]
+ }
+ ]
+ }
+ ],
+ order: [["id", "DESC"]]
+ })
+ res.json(
+ pins.map((pin) => {
+ const message = pin.dataValues.message.dataValues
+ return {
+ ...pin.dataValues,
+ message: {
+ ...pin.dataValues.message.dataValues,
+ keyId: `${message.id}-${message.updatedAt.toISOString()}`
+ }
+ }
+ })
+ )
+ } else {
+ throw Errors.invalidParameter("chat association id")
+ }
+ } catch (err) {
+ next(err)
+ }
+})
+
+router.post("/:id/pins", auth, async (req, res, next) => {
+ try {
+ const io = req.app.get("io")
+ const chat = await ChatAssociation.findOne({
+ where: {
+ userId: req.user.id,
+ id: req.params.id
+ },
+ include: [
+ {
+ model: Chat,
+ as: "chat",
+ include: [
+ {
+ model: User,
+ as: "users",
+ attributes: ["id"]
+ }
+ ]
+ }
+ ]
+ })
+ if (chat?.chat?.type === "direct" || chat?.rank === "admin") {
+ const message = await Message.findOne({
+ where: {
+ id: req.body.messageId,
+ chatId: chat.chat.id
+ }
+ })
+ if (message) {
+ const checkPin = await Pin.findOne({
+ where: {
+ messageId: message.id,
+ chatId: chat.chat.id
+ }
+ })
+ if (checkPin) {
+ await checkPin.destroy()
+ res.json({
+ message: "Message unpinned successfully."
+ })
+ return
+ }
+ const pin = await Pin.create({
+ chatId: chat.chat.id,
+ messageId: req.body.messageId,
+ pinnedById: req.user.id
+ })
+ await createMessage(
+ req,
+ "pin",
+ `${req.user.username} pinned a message to the chat.`,
+ chat,
+ req.user.id
+ )
+ res.json({
+ ...pin.dataValues,
+ message: "Message pinned successfully."
+ })
+ }
+ } else {
+ throw Errors.invalidParameter("chat association id")
+ }
+ } catch (e) {
+ next(e)
+ }
+})
+
router.put("/:id/read", auth, async (req, res, next) => {
try {
const io = req.app.get("io")
@@ -481,6 +655,11 @@ router.put("/:id/read", auth, async (req, res, next) => {
model: Chat,
as: "chat",
include: [
+ {
+ model: User,
+ as: "users",
+ attributes: ["id"]
+ },
{
model: Message,
as: "lastMessages",
@@ -501,6 +680,20 @@ router.put("/:id/read", auth, async (req, res, next) => {
lastRead: chat.chat.lastMessages[0]?.id || null
})
res.sendStatus(204)
+ for (const user of chat.chat.users) {
+ io.to(user.id).emit("readReceipt", {
+ id: chat.id,
+ messageId: chat.chat.lastMessages[0]?.id || null,
+ userId: req.user.id,
+ chatId: chat.chat.id,
+ user: {
+ username: req.user.username,
+ avatar: req.user.avatar,
+ id: req.user.id
+ },
+ previousMessageId: chat.lastRead
+ })
+ }
} else {
throw Errors.invalidParameter("chat association id")
}
@@ -877,6 +1070,18 @@ router.post(
id: message.id
},
include: [
+ {
+ model: ChatAssociation,
+ as: "readReceipts",
+ attributes: ["id"],
+ include: [
+ {
+ model: User,
+ as: "user",
+ attributes: ["username", "name", "avatar", "id"]
+ }
+ ]
+ },
{
model: Attachment,
as: "attachments"
@@ -1130,6 +1335,18 @@ router.post("/:id/message", auth, limiter, async (req, res, next) => {
id: message.id
},
include: [
+ {
+ model: ChatAssociation,
+ as: "readReceipts",
+ attributes: ["id"],
+ include: [
+ {
+ model: User,
+ as: "user",
+ attributes: ["username", "name", "avatar", "id"]
+ }
+ ]
+ },
{
model: Attachment,
as: "attachments"
@@ -1399,6 +1616,18 @@ router.get("/:id/messages", auth, async (req, res, next) => {
...or
},
include: [
+ {
+ model: ChatAssociation,
+ as: "readReceipts",
+ attributes: ["id"],
+ include: [
+ {
+ model: User,
+ as: "user",
+ attributes: ["username", "name", "avatar", "id"]
+ }
+ ]
+ },
{
model: Attachment,
as: "attachments"
@@ -1409,12 +1638,10 @@ router.get("/:id/messages", auth, async (req, res, next) => {
attributes: [
"username",
"name",
-
"avatar",
"id",
"createdAt",
"updatedAt",
-
"bot"
],
include: [
@@ -1439,12 +1666,10 @@ router.get("/:id/messages", auth, async (req, res, next) => {
attributes: [
"username",
"name",
-
"avatar",
"id",
"createdAt",
"updatedAt",
-
"bot"
]
},
diff --git a/frontend/package.json b/frontend/package.json
index 77e7571..90f2312 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,6 +1,6 @@
{
"name": "colubrina-chat",
- "version": "1.0.8",
+ "version": "1.0.9",
"private": true,
"author": "Troplo
-
-
- mdi-reply
-
- mdi-account
-
-
- mdi-file-image
-
-
- Click to view attachment
-
- {{ message.reply.content.substring(0, 100) }}
-
-
-
- mdi-account
-
-
-
- {{ getName(message.user) }}
-
- mdi-robot
-
-
- {{ $date(message.createdAt).format("hh:mm A, DD/MM/YYYY") }}
-
-
-
-
-
- mdi-pencil
-
-
-
-
- {{ $date(message.editedAt).format("DD/MM/YYYY hh:mm:ss A") }}
-
-
-
-
+
+ {{ fileTypes[attachment.extension] || "mdi-file" }}
+
+
+ {{ attachment.name }}
+
+
+
+ {{ attachment.name }} -
+ {{ friendlySize(attachment.size) }}
+
+ mdi-download
+
+
+
+
+
+
- mdi-download
+ mdi-delete
-
-
-
-
-
-
- mdi-delete
-
-
- mdi-pencil
-
-
- mdi-close
-
-
- mdi-reply
-
-
-
-
-
-
-
- mdi-arrow-left
-
- {{ message.content }}
-
-
-
- {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
-
-
-
- mdi-delete
-
-
- mdi-pencil
-
-
- mdi-close
-
-
- mdi-reply
-
-
-
-
-
-
-
- mdi-arrow-right
-
- {{ message.content }}
-
-
-
- {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
-
-
-
- mdi-delete
-
-
- mdi-pencil
-
-
- mdi-close
-
-
- mdi-reply
-
-
-
-
-
-
-
- mdi-pencil
-
- {{ message.content }}
-
-
-
- {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
-
-
-
- mdi-delete
-
-
- mdi-pencil
-
-
- mdi-close
-
-
- mdi-reply
-
-
-
-
-
-
-
- mdi-pencil
-
- {{ message.content }}
-
-
-
- {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
-
-
-
- mdi-delete
-
-
- mdi-pencil
-
-
- mdi-close
-
-
- mdi-reply
-
-
-
-
-
+
+ mdi-pencil
+
+
+ mdi-close
+
+
+ mdi-reply
+
+
+ mdi-pin
+
+
+
+
+
+
+
+ mdi-arrow-left
+
+ {{ message.content }}
+
+
+
+ {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
+
+
+
+ mdi-delete
+
+
+ mdi-pencil
+
+
+ mdi-close
+
+
+ mdi-reply
+
+
+
+
+
+
+
+ mdi-arrow-right
+
+ {{ message.content }}
+
+
+
+ {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
+
+
+
+ mdi-delete
+
+
+ mdi-pencil
+
+
+ mdi-close
+
+
+ mdi-reply
+
+
+
+
+
+
+
+ mdi-pencil
+
+ {{ message.content }}
+
+
+
+ {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
+
+
+
+ mdi-delete
+
+
+ mdi-pencil
+
+
+ mdi-close
+
+
+ mdi-reply
+
+
+
+
+
+
+
+ mdi-pin-outline
+
+ {{ message.content }}
+
+
+
+ {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
+
+
+
+ mdi-delete
+
+
+ mdi-pencil
+
+
+ mdi-close
+
+
+ mdi-reply
+
+
+
+
+
+
+
+ mdi-pencil
+
+ {{ message.content }}
+
+
+
+ {{ $date(message.createdAt).format("DD/MM/YYYY hh:mm A") }}
+
+
+
+ mdi-delete
+
+
+ mdi-pencil
+
+
+ mdi-close
+
+
+ mdi-reply
+
+
+
+
+
+
+
@@ -671,6 +747,7 @@ import {
PointElement,
LineElement
} from "chart.js"
+import AjaxErrorHandler from "@/lib/errorHandler"
ChartJS.register(
Title,
Tooltip,
@@ -749,6 +826,18 @@ export default {
}
},
methods: {
+ pinMessage() {
+ this.axios
+ .post(`/api/v1/communications/${this.chat.id}/pins`, {
+ messageId: this.message.id
+ })
+ .then((res) => {
+ this.$toast.success(res.data.message)
+ })
+ .catch((e) => {
+ AjaxErrorHandler(this.$store)(e)
+ })
+ },
friendlySize(size) {
if (size < 1024) {
return size + " bytes"
diff --git a/frontend/src/components/SimpleMessage.vue b/frontend/src/components/SimpleMessage.vue
new file mode 100644
index 0000000..11d3daa
--- /dev/null
+++ b/frontend/src/components/SimpleMessage.vue
@@ -0,0 +1,106 @@
+
+ +
+
+
- {{ message.content }}
-
-
-
- mdi-reply
+
+
-
-
-
- mdi-account
+
+
+ mdi-file-image
+
+
+ Click to view attachment
+
+ {{ message.reply.content.substring(0, 100) }}
+
+
+
+ mdi-account
+
+
+
+ {{ getName(message.user) }}
+
+ mdi-robot
+
+
+ {{ $date(message.createdAt).format("hh:mm A, DD/MM/YYYY") }}
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
- MediaProxy Image
-
- mdi-download
-
-
+ mdi-pencil
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+ {{
+ $date(message.editedAt).format("DD/MM/YYYY hh:mm:ss A")
+ }}
+
+
+
+
+
+
+
-
+
+
+
+
+
+
+
+
-
-
-
-
-
+
+
+ MediaProxy Image
+
+ mdi-download
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
- {{ fileTypes[attachment.extension] || "mdi-file" }}
-
-
- {{ attachment.name }}
-
-
-
- {{ attachment.name }} -
- {{ friendlySize(attachment.size) }}
-
+
+
+
+
+
+ mdi-arrow-expand-all
+
+
+
+
+
+
+ - {{ embed.openGraph.ogSiteName }} -
- -- {{ embed.openGraph.ogTitle }} -
- -- {{ embed.openGraph.ogDescription }} -
-
-
-
-
-
-
-
-
-
- mdi-arrow-expand-all
-
-
-
-
-
- - {{ embed.title }} -
-- {{ embed.description }} -
-- {{ graph.name }} -
-Chart data could not be loaded.
-+ {{ message.content }} +
+ +{{ field.name }}
-{{ field.value }}
++ {{ embed.openGraph.ogSiteName }} +
+ ++ {{ embed.openGraph.ogTitle }} +
+ ++ {{ embed.openGraph.ogDescription }} +
- {{ embed.link.title }} -
- - - {{ embed.footer }} - - -You must update Colubrina to see this embed.
+ +
+
+
+
+
+
+
+
+
+ mdi-arrow-expand-all
+
+
+
+
+
+ + {{ embed.title }} +
++ {{ embed.description }} +
++ {{ graph.name }} +
+Chart data could not be loaded.
+{{ field.name }}
+{{ field.value }}
++ {{ embed.link.title }} +
+ + + {{ embed.footer }} + +You must update Colubrina to see this embed.
+
-
+
+
-
-
+
-
-
-
-
-
- mdi-arrow-expand-all
-
-
-
-
-
-
+
+ mdi-reply
+
+ mdi-account
+
+
+ mdi-file-image
+
+
+ Click to view attachment
+
+ {{ message.reply.content.substring(0, 100) }}
+
+
+
+ mdi-account
+
+
+
+ {{ getName(message.user) }}
+
+ mdi-robot
+
+
+ {{ $date(message.createdAt).format("hh:mm A, DD/MM/YYYY") }}
+
+
+
+
+
+ mdi-pencil
+
+
+
+
+ {{ $date(message.editedAt).format("DD/MM/YYYY hh:mm:ss A") }}
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/store/index.js b/frontend/src/store/index.js
index d9f631c..c4d6135 100644
--- a/frontend/src/store/index.js
+++ b/frontend/src/store/index.js
@@ -35,6 +35,13 @@ export default new Vuex.Store({
version: process.env.VUE_APP_VERSION,
release: process.env.RELEASE
},
+ context: {
+ pins: {
+ x: null,
+ y: null,
+ value: false
+ }
+ },
drawer: true,
site: {
release: "stable",
diff --git a/frontend/src/views/Communications/CommunicationsChat.vue b/frontend/src/views/Communications/CommunicationsChat.vue
index 678a578..bbb08bf 100644
--- a/frontend/src/views/Communications/CommunicationsChat.vue
+++ b/frontend/src/views/Communications/CommunicationsChat.vue
@@ -1,5 +1,47 @@
+ {{ message.content }} +
+
+
+
+
+ Pins
+
+
+
+
+
+ mdi-close
+
+
+
+
+ Loading...
+
+
+ This chat has no pins yet.
+
+
+
+
-
+
Welcome to the start of
{{
$store.state.selectedChat?.chat?.type === "direct"
@@ -134,6 +180,14 @@
: $store.state.selectedChat?.chat?.name
}}
+
+ Welcome to the start of the conversation with
+ {{
+ $store.state.selectedChat?.chat?.type === "direct"
+ ? getDirectRecipient($store.state.selectedChat).username
+ : $store.state.selectedChat?.chat?.name
+ }}
+
@@ -716,12 +811,21 @@ import CommsInput from "@/components/CommsInput"
import NicknameDialog from "@/components/NicknameDialog"
import UserDialog from "@/components/UserDialog"
import Message from "@/components/Message"
+import SimpleMessage from "@/components/SimpleMessage"
export default {
name: "CommunicationsChat",
- components: { Message, UserDialog, NicknameDialog, CommsInput },
+ components: {
+ SimpleMessage,
+ Message,
+ UserDialog,
+ NicknameDialog,
+ CommsInput
+ },
props: ["chat", "loading", "items"],
data: () => ({
+ pins: [],
+ pinsLoading: true,
reachedTop: false,
graphOptions: {
responsive: true,
@@ -824,7 +928,8 @@ export default {
userPanel: true,
rateLimit: false,
loadingMessages: true,
- avoidAutoScroll: false
+ avoidAutoScroll: false,
+ lastRead: 0
}),
computed: {
associations() {
@@ -845,6 +950,35 @@ export default {
}
},
methods: {
+ removePin(id) {
+ this.axios
+ .post(`/api/v1/communications/${this.chat.id}/pins`, {
+ messageId: id
+ })
+ .then(() => {
+ this.getPins()
+ })
+ .catch((e) => {
+ AjaxErrorHandler(this.$store)(e)
+ })
+ },
+ getPins() {
+ this.pinsLoading = true
+ this.axios
+ .get(
+ process.env.VUE_APP_BASE_URL +
+ "/api/v1/communications/" +
+ this.$route.params.id +
+ "/pins"
+ )
+ .then((res) => {
+ this.pins = res.data
+ this.pinsLoading = false
+ })
+ .catch((e) => {
+ AjaxErrorHandler(this.$store)(e)
+ })
+ },
forceBottom() {
this.avoidAutoScroll = false
this.autoScroll()
@@ -1198,6 +1332,12 @@ export default {
.addEventListener("scroll", this.scrollEvent)
setInterval(() => {
this.typing()
+ if (
+ document.hasFocus() &&
+ this.messages[this.messages.length - 1]?.id !== this.lastRead
+ ) {
+ this.markRead()
+ }
}, 1000)
this.getMessages()
if (localStorage.getItem("userPanel")) {
@@ -1212,11 +1352,35 @@ export default {
if (drafts[this.$route.params.id]) {
this.message = drafts[this.$route.params.id]
}
+ this.$socket.on("readChat", (data) => {
+ if (data.id === this.chat.id) {
+ this.lastRead = data.lastRead
+ }
+ })
+ this.$socket.on("readReceipt", (data) => {
+ if (
+ data.messageId &&
+ data.chatId === this.chat.chatId &&
+ this.messages?.length
+ ) {
+ this.messages.forEach((message) => {
+ message.readReceipts = message.readReceipts.filter(
+ (readReceipt) => readReceipt.id !== data.id
+ )
+ })
+ this.messages
+ .find((message) => message.id === data.messageId)
+ .readReceipts?.push(data)
+ this.autoScroll()
+ }
+ })
this.$socket.on("message", (message) => {
if (message.chatId === this.chat.chatId) {
this.messages.push(message)
this.autoScroll()
- this.markRead()
+ if (document.hasFocus()) {
+ this.markRead()
+ }
if (this.messages.length > 50 && !this.avoidAutoScroll) {
this.messages.shift()
this.reachedTop = false
@@ -1265,6 +1429,11 @@ export default {
})
},
watch: {
+ "$store.state.context.pins.value"(val) {
+ if (val) {
+ this.getPins()
+ }
+ },
userPanel() {
localStorage.setItem("userPanel", JSON.stringify(this.userPanel))
},
@@ -1287,6 +1456,7 @@ export default {
this.reachedTop = false
this.avoidAutoScroll = false
this.offset = 0
+ this.pins = []
this.getMessages()
}
},
+
+
+
+
+
+
+ ![avatar]()
+ {{
+ association.user.username[0].toUpperCase()
+ }}
+
+
+
+
+ {{ association.user.username }} has read up to this point.
+
+
+
+
+
+
+