Cleaned Code for this Branch

backend/journaling/api/views.py

@@ -9,11 +9,29 @@ class JournalViewSet(viewsets.ModelViewSet):
     queryset = Journal.objects.all()
     serializer_class = JournalSerializer
 
+    def create(self, request, *args, **kwargs):
+        return super().create(request, *args, **kwargs)
+
+    def update(self, request, *args, **kwargs):
+        return super().update(request, *args, **kwargs)
+
+    def destroy(self, request, *args, **kwargs):
+        return super().destroy(request, *args, **kwargs)
+
 
 class JournalPageViewSet(viewsets.ModelViewSet):
     queryset = JournalPage.objects.all()
     serializer_class = JournalPageSerializer
 
+    def create(self, request, *args, **kwargs):
+        return super().create(request, *args, **kwargs)
+
+    def update(self, request, *args, **kwargs):
+        return super().update(request, *args, **kwargs)
+
+    def destroy(self, request, *args, **kwargs):
+        return super().destroy(request, *args, **kwargs)
+
 
 #Handling POST requests from frontend.
 

frontendMobile/src/Api/apiEndpoints.js

@@ -2,7 +2,7 @@
 // I made sure to put them all in one file to make frontend dev and backend dev communication a lot easier!
 
 HOST = "<YOUR_ADDRESS_HERE>"  // Put the IP here!
-DOMAIN = `http://${HOST}:8000/`
+DOMAIN = `http://${HOST}:8000`
 
 const endpoints = {
     getJournal: `${DOMAIN}/api/journal`,

frontendMobile/src/Components/Journaling/JournalItem.js

@@ -0,0 +1,23 @@
+import { View, Text, TouchableOpacity, StyleSheet } from 'react-native';
+import dateTimeFormat from '../../Utils/DateTimeFormat'
+import { mainStyle } from '../../Styles/Styles';
+
+const s = StyleSheet.create(mainStyle)
+
+const JournalItem = ({ journal, navigation }) => {
+
+    return (
+        <TouchableOpacity
+        key={journal.id}
+        style={s.journalView.container}
+        onPress={() => navigation.navigate("My Journal", { id: journal.id })}
+        >
+        <Text style={s.journalView.type}>{journal.name}</Text>
+        <View style={s.horizontalLine} />
+        <Text>{journal.journal_type}</Text>
+        <Text>{dateTimeFormat(journal.date_started)}</Text>
+        </TouchableOpacity>
+    )
+};
+
+export default JournalItem;

frontendMobile/src/Components/JournalPage.js → frontendMobile/src/Components/Journaling/JournalPage.js

@@ -1,5 +1,5 @@
 import { View, Text, TextInput, StyleSheet } from 'react-native';
-import { mainStyle } from '../Styles/Styles';
+import { mainStyle } from '../../Styles/Styles';
 
 const s = StyleSheet.create(mainStyle);
 

frontendMobile/src/Components/Journaling/JournalPageItem.js

@@ -0,0 +1,17 @@
+import { View, Text, StyleSheet } from 'react-native';
+import { mainStyle } from '../../Styles/Styles';
+
+const s = StyleSheet.create(mainStyle);
+
+const JournalPageItem = ({ page }) => {
+
+    return (
+        <View key={page.id} style={{ textAlign: 'center' }}>
+            <Text style={s.text}>{page.prompt}</Text>
+            <View style={s.horizontalLine} />
+            <Text>{page.entry}</Text>
+        </View>
+    )
+};
+
+export default JournalPageItem;

frontendMobile/src/Components/JournalingChoices.js → frontendMobile/src/Components/Journaling/JournalingChoices.js

@@ -1,5 +1,5 @@
 import { StyleSheet, Text, View, Modal, TouchableOpacity } from 'react-native';
-import { mainStyle } from '../Styles/Styles';
+import { mainStyle } from '../../Styles/Styles';
 
 const s = StyleSheet.create(mainStyle)
 

frontendMobile/src/Screens/HomeScreen.js

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import { StyleSheet, Animated, Easing, Text, View, TouchableOpacity } from 'react-native';
 import { mainStyle } from '../Styles/Styles';
-import JournalingChoices from '../Components/JournalingChoices';
+import JournalingChoices from '../Components/Journaling/JournalingChoices';
 import Habits from '../Components/Habits';
 import dateTimeFormat from '../Utils/DateTimeFormat';
 

frontendMobile/src/Screens/Journaling/JournalingScreen.js

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { View, Text, TouchableOpacity, StyleSheet, TouchableWithoutFeedback, Keyboard } from 'react-native';
 import { mainStyle } from '../../Styles/Styles';
 import RandomPromptGenerator from '../../Utils/Prompts';
-import JournalPage from '../../Components/JournalPage';
+import JournalPage from '../../Components/Journaling/JournalPage';
 
 const s = StyleSheet.create(mainStyle);
 

frontendMobile/src/Screens/Journaling/ViewJournalsScreen.js

@@ -3,9 +3,19 @@ import { useFocusEffect } from '@react-navigation/native'
 import { View, Text, TouchableOpacity, StyleSheet, ScrollView, Button } from 'react-native';
 import endpoints from '../../Api/apiEndpoints';
 import { mainStyle } from '../../Styles/Styles';
-import dateTimeFormat from '../../Utils/DateTimeFormat';
+import JournalItem from '../../Components/Journaling/JournalItem';
 
 const s = StyleSheet.create(mainStyle);
+
+  const SortingButton = ({ option, chooseSort }) => (
+    <View style={s.column}>
+      <Button
+        style={s.button}
+        onPress={() => chooseSort(option)}
+        title={option.charAt(0).toUpperCase() + option.slice(1)}
+      />
+    </View>
+  );
 
 const ViewJournalsScreen = ({ navigation }) => {
 
@@ -35,25 +45,13 @@ const ViewJournalsScreen = ({ navigation }) => {
                 <Text>--Sort By Tab--</Text>
                 <View style={s.row}>
                     {Object.keys(sortingOptions).map((option) => (
-                        <View style={s.column} key={option}>
-                            <Button style={s.button} key={option}
-                            onPress={() => chooseSort(option)} 
-                            title={option.charAt(0).toUpperCase() + option.slice(1)} />
-                        </View>
+                        <SortingButton key={option} option={option} chooseSort={chooseSort} />
                     ))}
                 </View>
             </View>
             <ScrollView>
                 {sortedJournals.map((journal) => (
-                    <TouchableOpacity 
-                    key={journal.id} 
-                    style={s.journalView.container}
-                    onPress={() => navigation.navigate("My Journal", {id: journal.id})}>
-                        <Text style={s.journalView.type}>{journal.name}</Text>
-                        <View style={s.horizontalLine} />
-                        <Text>{journal.journal_type}</Text>
-                        <Text>{dateTimeFormat(journal.date_started)}</Text>
-                    </TouchableOpacity>
+                    <JournalItem key={journal.id} journal={journal} navigation={navigation} />
                 ))}
             </ScrollView>
         </View>

frontendMobile/src/Screens/Journaling/ViewPagesScreen.js

@@ -3,6 +3,7 @@ import { View, Text, StyleSheet, Button } from 'react-native';
 import endpoints from '../../Api/apiEndpoints';
 import { mainStyle } from '../../Styles/Styles';
 import Warning from '../../Components/Warning';
+import JournalPageItem from '../../Components/Journaling/JournalPageItem';
 
 const s = StyleSheet.create(mainStyle);
 
@@ -23,7 +24,6 @@ const ViewPagesScreen = ({navigation, route }) => {
     const toggleWarning = () => {
         setWarningVisible(!warningVisible);
     }
-
     const deleteJournal = (id) => {
         endpoints.deleteApiResponse(endpoints.deleteJournal, id);
         navigation.navigate("View Journals");
@@ -36,11 +36,7 @@ const ViewPagesScreen = ({navigation, route }) => {
                 <Button title="Delete" onPress={toggleWarning}/>
             </View>
             {filteredPages.map((page) => (
-                <View key={page.id} style={{textAlign: 'center'}}>
-                    <Text style={s.text}>{page.prompt}</Text>
-                    <View style={s.horizontalLine} />
-                    <Text>{page.entry}</Text>
-                </View>
+                <JournalPageItem key={page.id} page={page} />
             ))}
             <Warning
                 visible={warningVisible}