diff --git a/messages-app-frontend/src/App.tsx b/messages-app-frontend/src/App.tsx index 5bec660c045b937de16b2f9ae17ca9a2f776b017..49df6b4650e7fdb46d97512e855ca8f67ad3dcbf 100644 --- a/messages-app-frontend/src/App.tsx +++ b/messages-app-frontend/src/App.tsx @@ -5,10 +5,12 @@ import NewMessage from "./NewMessage"; import Welcome from "./Welcome"; import Message from "./Message"; -type messageType = { +export type messageType = { message: string, __v: Number, - _id: string + _id: string, + createdAt: Date, + modifiedAt: Date } type AppState = { @@ -20,7 +22,11 @@ type AppState = { _id: string } } +//ACTUAL URL +//https://messages-app-backend.herokuapp.com/ +//DEV URL +//http://localhost:3010/ const api = axios.create({ baseURL: `https://messages-app-backend.herokuapp.com/` }); @@ -37,7 +43,7 @@ const messageBox = { -export default class App extends React.Component{ +export class App extends React.Component{ state: AppState = { messages: [], diff --git a/messages-app-frontend/src/Message.tsx b/messages-app-frontend/src/Message.tsx index 081e8ffc329a89240e270ee4c96f98da8d443565..5d5e1c734dec848a5af802e72c859f0d1ae46ae4 100644 --- a/messages-app-frontend/src/Message.tsx +++ b/messages-app-frontend/src/Message.tsx @@ -1,13 +1,8 @@ import React from 'react'; -import {IconButton, Paper} from '@mui/material'; +import {IconButton, Paper, Typography} from '@mui/material'; import DeleteIcon from '@mui/icons-material/Delete'; import EditIcon from '@mui/icons-material/Edit'; - -type messageType = { - message: string, - __v: Number, - _id: string -} +import type {messageType} from "./App"; type IProps = { singleMessage: messageType, @@ -16,9 +11,31 @@ type IProps = { } export default class Message extends React.Component<IProps>{ + + timeCreated = (singleMessage: messageType) => { + if(this.props.singleMessage.createdAt !== undefined){ + return ( + <Typography> + Created at: {this.props.singleMessage.createdAt.toString()} + </Typography> + ) + } + } + + + timeModified = (singleMessage: messageType) => { + if(this.props.singleMessage.modifiedAt !== undefined){ + return ( + <Typography> + Modified at: {this.props.singleMessage.modifiedAt.toString()} + </Typography> + ) + } + } render(): React.ReactNode{ + return( <Paper elevation={5} @@ -47,9 +64,12 @@ export default class Message extends React.Component<IProps>{ > <DeleteIcon /> </IconButton> - + {this.timeCreated(this.props.singleMessage)} + {this.timeModified(this.props.singleMessage)} + </Paper> ) + } } \ No newline at end of file diff --git a/messages-app-frontend/src/index.tsx b/messages-app-frontend/src/index.tsx index 4515ac13aa39ebd35665933723f4207c2e093578..2922a9780dcc349ccd29334d25ca967c51f2d7fc 100644 --- a/messages-app-frontend/src/index.tsx +++ b/messages-app-frontend/src/index.tsx @@ -1,6 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; -import App from './App'; +import {App} from './App'; import CssBaseline from "@mui/material/CssBaseline"; import { ThemeProvider, createTheme } from "@mui/material/styles"; diff --git a/messagesAppBackend/src/Message.ts b/messagesAppBackend/src/Message.ts index bbefd5859dfc9b79b5908718c4d588f1f1b9bf26..c68785e7b28028546df593792809a2f88fc08b2d 100644 --- a/messagesAppBackend/src/Message.ts +++ b/messagesAppBackend/src/Message.ts @@ -2,14 +2,16 @@ import mongoose from "mongoose"; export interface messageInterface extends Document { - message: String + message: String, + createdAt: Date, + modifiedAt: Date } const messageSchema: mongoose.Schema = new mongoose.Schema({ - message: {type: String} + message: {type: String}, + createdAt: {type: Date}, + modifiedAt: {type: Date} }); -const messageModel = mongoose.model<messageInterface>("messages", messageSchema); - -export default messageModel; \ No newline at end of file +export default mongoose.model<messageInterface>("messages", messageSchema); \ No newline at end of file diff --git a/messagesAppBackend/src/server.ts b/messagesAppBackend/src/server.ts index 83d3acf59ba99a6f65bed7731eea6f6f7cfad281..5c926417403e157399e0379ef2c7828bafd976ed 100644 --- a/messagesAppBackend/src/server.ts +++ b/messagesAppBackend/src/server.ts @@ -18,35 +18,27 @@ app.get("/users", async (req, res) => { }) app.get("/messages", async (req, res) => { - //await mongoose.connect("mongodb+srv://joasep:koira@messagescluster0.nvb8tqc.mongodb.net/?retryWrites=true&w=majority"); let messages = await findMessage(); res.send(messages); - //mongoose.disconnect(); }) app.post("/messages", async (req, res) => { - //await mongoose.connect("mongodb+srv://joasep:koira@messagescluster0.nvb8tqc.mongodb.net/?retryWrites=true&w=majority"); await addMessage(req.body.message); res.sendStatus(200); - //mongoose.disconnect(); }) app.delete("/messages/:id", async (req, res) => { - //await mongoose.connect("mongodb+srv://joasep:koira@messagescluster0.nvb8tqc.mongodb.net/?retryWrites=true&w=majority"); await deleteMessage(req.params.id); res.sendStatus(200); - //mongoose.disconnect(); }) app.put("/messages/:id", async (req, res) => { - //await mongoose.connect("mongodb+srv://joasep:koira@messagescluster0.nvb8tqc.mongodb.net/?retryWrites=true&w=majority"); await modifyMessage(req.params.id, req.body.message); res.sendStatus(200); - //mongoose.disconnect(); }) async function modifyMessage(messageID, messageBody){ - await Message.updateOne({_id: messageID}, {message: messageBody}) + await Message.updateOne({_id: messageID}, {message: messageBody, modifiedAt: new Date()}) } async function deleteMessage(messageID){ @@ -55,7 +47,7 @@ async function deleteMessage(messageID){ async function addMessage(messageContent){ - await Message.create({message: messageContent}) + await Message.create({message: messageContent, createdAt: new Date()}) } async function findMessage(){