Skip to content

Commit 3f669ee

Browse files
committed
Completely functional -final commit
1 parent fd2daa6 commit 3f669ee

File tree

14 files changed

+248
-90
lines changed

14 files changed

+248
-90
lines changed

src/App.js

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,10 +11,10 @@ import { Button } from "@mui/material";
1111
import NotesPage from "./pages/Mynotes/mynotes";
1212
import { categoriesOfUser } from "./appwrite/database.appwrite";
1313
import CategoriesPage from "./pages/categories/categories";
14+
import { getAllNotes } from "./appwrite/database.appwrite";
1415

1516
const Homepage = () => <h1>Hello home</h1>;
1617

17-
1818
const Signin = () => <h1>Signin</h1>;
1919

2020
const Signup = () => <h1>Signup</h1>;
@@ -42,6 +42,17 @@ class App extends React.Component {
4242
() => console.log(this.state.categories)
4343
);
4444
});
45+
getAllNotes(response["$id"]).then(
46+
(res) =>
47+
this.setState(
48+
{
49+
...this.state,
50+
notes: res["documents"],
51+
},
52+
() => console.log(this.state.notes)
53+
),
54+
(err) => console.log(err)
55+
);
4556
this.setState(
4657
{
4758
...this.state,
@@ -73,17 +84,21 @@ class App extends React.Component {
7384
render() {
7485
return (
7586
<div>
76-
<Header user={this.state.user}></Header>
87+
{
88+
(this.state.user!==null)?
89+
(<Header user={this.state.user}></Header>) : null
90+
}
7791
<Switch>
7892
<Route
7993
exact
8094
path="/categories"
8195
render={() =>
8296
this.state.user !== null ? (
83-
<CategoriesPage categories={this.state.categories} user={this.state.user} />
84-
) : (
85-
null
86-
)
97+
<CategoriesPage
98+
categories={this.state.categories}
99+
user={this.state.user}
100+
/>
101+
) : null
87102
}
88103
/>
89104
<Route
@@ -105,14 +120,17 @@ class App extends React.Component {
105120
path="/"
106121
render={() =>
107122
this.state.user !== null ? (
108-
<NotesPage categories={this.state.categories} />
123+
<NotesPage
124+
categories={this.state.categories}
125+
user={this.state.user}
126+
notes={this.state.notes}
127+
/>
109128
) : (
110129
<Redirect to="/signin" />
111130
)
112131
}
113132
/>
114133
</Switch>
115-
116134
</div>
117135
);
118136
}

src/appwrite/config.appwrite.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,9 @@ const loginUser = (email,password)=> {
1212
return sdk.account.createSession(email,password);
1313
}
1414

15+
export const createUser = (email,password,name)=>{
16+
return sdk.account.create(email,password,name='User');
17+
}
1518

1619

1720

src/appwrite/database.appwrite.js

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,5 +13,28 @@ const editCategory = (id,data) =>{
1313
return sdk.database.updateDocument('6166c7e8106b3', id,data);
1414
}
1515

16+
const getAllNotes = (userId) =>{
17+
return sdk.database.listDocuments('6166c81843a9e',[`user=${userId}`])
18+
}
19+
20+
const createNote = (data)=>{
21+
return sdk.database.createDocument('6166c81843a9e',data,['*'], ['*'])
22+
}
23+
24+
const editNote = (id,data)=>{
25+
return sdk.database.updateDocument('6166c81843a9e',id,data)
26+
}
27+
28+
const getNotesViaCategory = (userId, categoryId) =>{
29+
return sdk.database.listDocuments('6166c81843a9e',[`user=${userId}`, `category=${categoryId}`])
30+
}
31+
32+
export const deleteNote = (id)=>{
33+
return sdk.database.deleteDocument('6166c81843a9e', id);
34+
}
35+
36+
export const deleteCategory = (id)=>{
37+
return sdk.database.deleteDocument('6166c7e8106b3',id);
38+
}
1639

17-
export {categoriesOfUser, createCategory, editCategory};
40+
export {categoriesOfUser, createCategory, editCategory, getAllNotes, getNotesViaCategory,createNote, editNote};

src/components/CategoryNavigation/categorynavigation.jsx

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,8 @@ import Box from "@mui/material/Box";
55
import ActionAreaCard from "../card/card";
66
import NotesContainer from "../notesContainer/notesContainer";
77
import NewCard from "../NewNote/newNote";
8+
import { getAllNotes, getNotesViaCategory } from "../../appwrite/database.appwrite";
9+
import { useEffect } from "react";
810

911
const buttonStyle = {
1012
display : 'flex',
@@ -15,9 +17,25 @@ const buttonStyle = {
1517

1618
export default function ScrollableTabsButtonForce(props) {
1719
const [value, setValue] = React.useState(0);
20+
const [notes,setNotes] = React.useState(props.notes);
21+
const [changed,setchanged] = React.useState(false)
22+
1823

1924
const handleChange = (event, newValue) => {
25+
setchanged(true);
2026
setValue(newValue);
27+
if (newValue===0) {
28+
getAllNotes(props.user).then((response)=>{
29+
setNotes(response['documents']);
30+
console.log(response['documents'])
31+
}, err=>console.log(err))
32+
}
33+
else {
34+
getNotesViaCategory(props.user,newValue).then(res=>{
35+
setNotes(res['documents'])
36+
console.log(res['documents'])
37+
}, err=>console.log(err))
38+
}
2139
console.log(newValue);
2240
};
2341
return (
@@ -50,11 +68,10 @@ export default function ScrollableTabsButtonForce(props) {
5068
))}
5169
</Tabs>
5270
</Box>
53-
<NotesContainer></NotesContainer>
71+
<NotesContainer {...props} notes= {(!changed)?props.notes:notes}></NotesContainer>
5472
<div style={buttonStyle}>
55-
<NewCard >Create New Card</NewCard>
73+
<NewCard category={value} user = {props.user}>Create New Card</NewCard>
5674
</div>
57-
5875
</div>
5976
);
6077
}

src/components/Dropdown/dropdown.jsx

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,20 @@ import InputLabel from '@mui/material/InputLabel';
33
import MenuItem from '@mui/material/MenuItem';
44
import FormControl from '@mui/material/FormControl';
55
import Select from '@mui/material/Select';
6+
import { editCategory, editNote } from '../../appwrite/database.appwrite';
67

78
export default function Dropdown(props) {
8-
const [category, setCategory] = React.useState('');
9+
const [category, setCategory] = React.useState('no-category');
910

1011
const handleChange = (event) => {
1112
setCategory(event.target.value);
13+
console.log(props.categories)
1214
console.log("category for post" + props.title + "changed to " + event.target.value);
15+
editNote(props.noteId,{"category" : event.target.value}).then(res=>console.log(res), err=>alert(err.message))
1316
};
1417

18+
19+
1520
const styles = {
1621
marginTop : '1rem',
1722
m : 1,
@@ -40,9 +45,12 @@ export default function Dropdown(props) {
4045
<MenuItem value="">
4146
<em>None</em>
4247
</MenuItem>
43-
<MenuItem value={10}>Category -1 </MenuItem>
44-
<MenuItem value={21}>Category -2</MenuItem>
45-
<MenuItem value={22}>Category -3</MenuItem>
48+
{
49+
props.categories.map(category=>(
50+
<MenuItem key={[category['$id']]} value={category['$id']}>{category['title']}</MenuItem>
51+
))
52+
}
53+
4654
</Select>
4755
</FormControl>
4856
</div>

src/components/NewNote/newNote.jsx

Lines changed: 77 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,104 @@
1-
import * as React from 'react';
2-
import Card from '@mui/material/Card';
3-
import CardContent from '@mui/material/CardContent';
4-
import CardMedia from '@mui/material/CardMedia';
5-
import Typography from '@mui/material/Typography';
6-
import { CardActionArea } from '@mui/material';
7-
import TextField from '@mui/material/TextField';
8-
import Dropdown from '../Dropdown/dropdown';
9-
import Box from '@mui/material/Box';
10-
import Button from '@mui/material/Button';
1+
import * as React from "react";
2+
// import Card from "@mui/material/Card";
3+
// import CardContent from "@mui/material/CardContent";
4+
// import CardMedia from "@mui/material/CardMedia";
5+
// import Typography from "@mui/material/Typography";
6+
// import { CardActionArea } from "@mui/material";
7+
import TextField from "@mui/material/TextField";
8+
import Dropdown from "../Dropdown/dropdown";
9+
import Box from "@mui/material/Box";
10+
import Button from "@mui/material/Button";
1111

12-
import Modal from '@mui/material/Modal';
13-
import { display } from '@mui/system';
12+
import Modal from "@mui/material/Modal";
13+
// import { display } from "@mui/system";
14+
import { createNote} from "../../appwrite/database.appwrite";
15+
import { reloadNotesContainer } from "../notesContainer/notesContainer";
1416

1517
const style = {
16-
position: 'absolute',
17-
top: '50%',
18-
left: '50%',
19-
transform: 'translate(-50%, -50%)',
18+
position: "absolute",
19+
top: "50%",
20+
left: "50%",
21+
transform: "translate(-50%, -50%)",
2022
width: {
21-
xs : '60%',
22-
sm : '50%'
23+
xs: "60%",
24+
sm: "50%",
2325
},
24-
bgcolor: 'background.paper',
25-
border: '2px solid #000',
26+
bgcolor: "background.paper",
27+
border: "2px solid #000",
2628
boxShadow: 24,
2729
p: 4,
28-
height : 'auto',
29-
display : 'flex',
30-
flexDirection : 'column',
31-
30+
height: "auto",
31+
display: "flex",
32+
flexDirection: "column",
3233
};
3334

3435
const fieldStyle = {
35-
marginTop : '1rem',
36-
}
36+
marginTop: "1rem",
37+
};
38+
3739

38-
const CardStyle = {
39-
maxWidth : {
40-
xs : 250,
41-
sm : 340
42-
},
43-
}
4440
export default function NewCard(props) {
45-
const [open, setOpen] = React.useState(false);
46-
const handleOpen = () => setOpen(true);
47-
const handleClose = () => setOpen(false);
48-
const [title,setTitle] = React.useState('');
49-
const[body,setBody] = React.useState('');
41+
const [open, setOpen] = React.useState(false);
42+
const handleOpen = () => setOpen(true);
43+
const handleClose = () => setOpen(false);
44+
const [title, setTitle] = React.useState("");
45+
const [body, setBody] = React.useState("");
5046

47+
const handleSave = () => {
48+
const data = {
49+
title: title,
50+
content: body,
51+
user: props.user,
52+
category: (props.category===0)?"no-category":props.category,
5153

54+
};
55+
createNote(data).then(
56+
(res) => {
57+
console.log(res);
58+
handleClose();
59+
reloadNotesContainer();
60+
},
61+
(err) => console.log(err)
62+
);
63+
};
5264

53-
5465
return (
5566
<div>
56-
<Button {...props} onClick={handleOpen} variant="contained">{props.children}</Button>
57-
<Modal
67+
<Button {...props} onClick={handleOpen} variant="contained">
68+
{props.children}
69+
</Button>
70+
<Modal
5871
open={open}
5972
onClose={handleClose}
6073
aria-labelledby="modal-modal-title"
6174
aria-describedby="modal-modal-description"
6275
>
6376
<Box sx={style}>
64-
65-
<TextField label="Title" fullWidth value={title} onChange={(event)=>setTitle(event.target.value)} color="primary" focused />
66-
<TextField
67-
id="outlined-multiline-static"
68-
sx = {fieldStyle}
69-
label="Note"
70-
fullWidth
71-
multiline={true}
72-
rows={10}
73-
defaultValue={body}
74-
/>
75-
<Dropdown title={title}></Dropdown>
76-
<Button sx ={fieldStyle} variant="contained">Save</Button>
77+
<TextField
78+
label="Title"
79+
fullWidth
80+
value={title}
81+
onChange={(event) => setTitle(event.target.value)}
82+
color="primary"
83+
focused
84+
/>
85+
<TextField
86+
id="outlined-multiline-static"
87+
sx={fieldStyle}
88+
label="Note"
89+
fullWidth
90+
multiline={true}
91+
onChange={(event) => setBody(event.target.value)}
92+
93+
rows={10}
94+
defaultValue={body}
95+
/>
96+
97+
<Button sx={fieldStyle} variant="contained" onClick={handleSave}>
98+
Save
99+
</Button>
77100
</Box>
78101
</Modal>
79102
</div>
80103
);
81-
}
104+
}

0 commit comments

Comments
 (0)