From ab8116176e95a1987c3d9766fb4d40a0c61e8976 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joonas=20Sepp=C3=A4?= <joasep@utu.fi>
Date: Mon, 13 Mar 2023 07:04:15 +0200
Subject: [PATCH] Breaking the app to shutdown infinite posts

---
 messages-app-frontend/src/App.tsx        | 19 +++++++++-
 messages-app-frontend/src/Message.tsx    |  2 +-
 messages-app-frontend/src/NewMessage.tsx | 48 ++++++++++++++++++++++++
 messagesAppBackend/src/server.ts         |  2 +-
 4 files changed, 67 insertions(+), 4 deletions(-)
 create mode 100644 messages-app-frontend/src/NewMessage.tsx

diff --git a/messages-app-frontend/src/App.tsx b/messages-app-frontend/src/App.tsx
index 0dc1d88..3866f51 100644
--- a/messages-app-frontend/src/App.tsx
+++ b/messages-app-frontend/src/App.tsx
@@ -4,6 +4,7 @@ import {Button, IconButton, Container, Typography, Box, Input, Paper} from '@mui
 import SendIcon from '@mui/icons-material/Send';
 import DeleteIcon from '@mui/icons-material/Delete';
 import EditIcon from '@mui/icons-material/Edit';
+import NewMessage from "./NewMessage"
 //import IconButton from '@mui/material';
 
 //import SendIcon from '@mui/icons-material';
@@ -75,6 +76,11 @@ export default class App extends React.Component{
     this.getMessages();
   }
 
+  inputValueChanged(newValue: any){
+    this.setState({newMessage: newValue})
+    //(p) => this.setState({newMessage: p.target.value})
+  }
+
   updatingMessage = (p: messageType) => {
     if(p._id === this.state.editingMessage._id){
       return (
@@ -159,10 +165,19 @@ export default class App extends React.Component{
             <Input value={this.state.newMessage} onChange={(p) => this.setState({newMessage: p.target.value})}></Input>
             <Button /*color="success"*/ sx={{margin: 1.5}} variant="contained" endIcon={<SendIcon />} onClick={this.createMessage}>Send</Button>
           </Box>
-
+          
         </Container>
 
       )
     }
   }
-}
\ No newline at end of file
+}
+//<NewMessage inputValue={this.state.newMessage} createMessage={this.createMessage} onChangeValue={this.inputValueChanged}/>
+
+/*
+
+    inputValue: string,
+    createMessage: Function,
+    onChangeValue: Function
+
+*/
\ No newline at end of file
diff --git a/messages-app-frontend/src/Message.tsx b/messages-app-frontend/src/Message.tsx
index 92e8ca7..d7358ce 100644
--- a/messages-app-frontend/src/Message.tsx
+++ b/messages-app-frontend/src/Message.tsx
@@ -3,7 +3,7 @@ import { Component } from "react";
 interface IState {
     message: String;
     _id: String;
-  }
+}
 
 class Message extends Component<IState>{
 
diff --git a/messages-app-frontend/src/NewMessage.tsx b/messages-app-frontend/src/NewMessage.tsx
new file mode 100644
index 0000000..20cdb8d
--- /dev/null
+++ b/messages-app-frontend/src/NewMessage.tsx
@@ -0,0 +1,48 @@
+import React from 'react';
+import {Button, IconButton, Container, Typography, Box, Input, Paper} from '@mui/material';
+import SendIcon from '@mui/icons-material/Send';
+import DeleteIcon from '@mui/icons-material/Delete';
+import EditIcon from '@mui/icons-material/Edit';
+import { AxiosInstance } from 'axios';
+
+type hello = {
+    inputValue: string,
+    createMessage: Function,
+    onChangeValue: Function
+}
+
+type NewMessageState = {
+
+}
+
+export default class NewMessage extends React.Component<hello>{
+
+    state: NewMessageState = {
+
+    }
+
+    /*
+    createMessage = async () => {
+        await this.props.api.post('/messages', {message: this.state.newMessage});
+        this.setState({newMessage: ""});
+        //this.getMessages();
+    }
+    */
+
+    /*
+
+                <Box sx={{textAlign: "center", paddingTop: 5}}>
+                <Input value={this.state.newMessage} onChange={(p) => this.setState({newMessage: p.target.value})}></Input>
+                <Button /*color="success"*//* sx={{margin: 1.5}} variant="contained" endIcon={<SendIcon />} onClick={this.createMessage}>Send</Button>
+                </Box>
+
+    */
+    render(){
+        return(
+            <Box sx={{textAlign: "center", paddingTop: 5}}>
+                <Input value={this.props.inputValue} onChange={(p) => this.props.onChangeValue(p.target.value)}></Input>
+                <Button /*color="success"*/ sx={{margin: 1.5}} variant="contained" endIcon={<SendIcon />} onClick={this.props.createMessage()}>Send</Button>
+            </Box>
+        )
+    }
+}
\ No newline at end of file
diff --git a/messagesAppBackend/src/server.ts b/messagesAppBackend/src/server.ts
index 83d3acf..5dc201c 100644
--- a/messagesAppBackend/src/server.ts
+++ b/messagesAppBackend/src/server.ts
@@ -7,7 +7,7 @@ const app = express()
 app.use(express.json());
 app.use(cors());
 
-mongoose.connect("mongodb+srv://joasep:koira@messagescluster0.nvb8tqc.mongodb.net/?retryWrites=true&w=majority");
+//mongoose.connect("mongodb+srv://joasep:koira@messagescluster0.nvb8tqc.mongodb.net/?retryWrites=true&w=majority");
 
 app.get("/", async (req, res) => {
     res.send("This is the root of the API!");
-- 
GitLab