Added progress bar for assignments (UI fix needed)
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Assignment, Task } from '@/lib/types';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { Session } from '@supabase/supabase-js';
|
||||
import { router, Stack, useFocusEffect } from 'expo-router';
|
||||
@@ -12,19 +13,9 @@ import {
|
||||
View,
|
||||
} from 'react-native';
|
||||
|
||||
type Assignment = {
|
||||
aId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
deadline: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
sId: string;
|
||||
};
|
||||
|
||||
export default function Assignments() {
|
||||
const [assignments, SetAssignments] = useState<Assignment[]>([]);
|
||||
const [tasksByAssignment, SetTasksByAssignment] = useState<Record<string, Task[]>>({});
|
||||
const [session, SetSession] = useState<Session | null>(null);
|
||||
|
||||
const assignmentSections = [
|
||||
@@ -55,17 +46,47 @@ export default function Assignments() {
|
||||
}, []);
|
||||
|
||||
const GetAssignments = async () => {
|
||||
const { data, error } = await supabase
|
||||
const { data: assignmentsData, error: assignmentsError } = await supabase
|
||||
.from('assignments')
|
||||
.select('*')
|
||||
.order('deadline', { ascending: false });
|
||||
|
||||
if (error) {
|
||||
if (assignmentsError) {
|
||||
Alert.alert('Assignments could not be fetched, please try again');
|
||||
return;
|
||||
}
|
||||
|
||||
SetAssignments(data ?? []);
|
||||
const assignmentRows = assignmentsData ?? [];
|
||||
SetAssignments(assignmentRows);
|
||||
|
||||
if (assignmentRows.length === 0) {
|
||||
SetTasksByAssignment({});
|
||||
return;
|
||||
}
|
||||
|
||||
const aIds = assignmentRows.map((assignment) => assignment.aId);
|
||||
|
||||
const { data: tasksData, error: tasksError } = await supabase
|
||||
.from('tasks')
|
||||
.select('*')
|
||||
.in('aId', aIds);
|
||||
|
||||
if (tasksError) {
|
||||
Alert.alert('Assignment tasks could not be fetched, please try again');
|
||||
SetTasksByAssignment({});
|
||||
return;
|
||||
}
|
||||
|
||||
const groupedTasks: Record<string, Task[]> = {};
|
||||
|
||||
for (const task of tasksData ?? []) {
|
||||
if (!groupedTasks[task.aId]) {
|
||||
groupedTasks[task.aId] = [];
|
||||
}
|
||||
groupedTasks[task.aId].push(task);
|
||||
}
|
||||
|
||||
SetTasksByAssignment(groupedTasks);
|
||||
};
|
||||
|
||||
useFocusEffect(
|
||||
@@ -178,6 +199,9 @@ export default function Assignments() {
|
||||
renderItem={({ item }) => {
|
||||
const isOwner = session?.user.id === item.uId;
|
||||
|
||||
const assignmentTasks = tasksByAssignment[item.aId] ?? [];
|
||||
const progress = assignmentTasks.length === 0 ? 0 : Math.round((assignmentTasks.filter(task => task.isCompleted).length / assignmentTasks.length) * 100);
|
||||
|
||||
return (
|
||||
<View className="mb-4 rounded-3xl border border-app-border bg-app-surface p-4 shadow-sm">
|
||||
<Pressable
|
||||
@@ -228,6 +252,28 @@ export default function Assignments() {
|
||||
Deadline: {item.deadline || 'No deadline'}
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
<View style={{ marginTop: 10 }}>
|
||||
<Text style={{ marginBottom: 4 }}>{progress}%</Text>
|
||||
|
||||
<View
|
||||
style={{
|
||||
width: "100%",
|
||||
height: 12,
|
||||
backgroundColor: "#D9D9D9",
|
||||
borderRadius: 999,
|
||||
overflow: "hidden",
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
width: `${progress}%`,
|
||||
height: "100%",
|
||||
backgroundColor: "#4CAF50",
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</Pressable>
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Subject } from '@/lib/types';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { Session } from '@supabase/supabase-js';
|
||||
import { router, Stack, useFocusEffect } from 'expo-router';
|
||||
@@ -12,15 +13,6 @@ import {
|
||||
View,
|
||||
} from 'react-native';
|
||||
|
||||
type Subject = {
|
||||
sId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isActive: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
};
|
||||
|
||||
export default function Subjects() {
|
||||
const [subjects, SetSubjects] = useState<Subject[]>([]);
|
||||
const [session, SetSession] = useState<Session | null>(null);
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Task } from '@/lib/types';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { Session } from '@supabase/supabase-js';
|
||||
import { router, Stack, useFocusEffect } from 'expo-router';
|
||||
@@ -12,16 +13,6 @@ import {
|
||||
View,
|
||||
} from 'react-native';
|
||||
|
||||
type Task = {
|
||||
tId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
aId: string;
|
||||
};
|
||||
|
||||
export default function Tasks() {
|
||||
const [tasks, SetTasks] = useState<Task[]>([]);
|
||||
const [session, SetSession] = useState<Session | null>(null);
|
||||
|
||||
@@ -1,22 +1,12 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { GetAssignmentNotificationId, RemoveAssignmentNotificationId, SaveAssignmentNotificationId } from '@/lib/asyncStorage';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Assignment } from '@/lib/types';
|
||||
import * as Notifications from 'expo-notifications';
|
||||
import { router, Stack, useFocusEffect, useLocalSearchParams } from 'expo-router';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { ActivityIndicator, Alert, Button, Keyboard, KeyboardAvoidingView, Platform, Pressable, Text, TextInput, TouchableWithoutFeedback, View } from 'react-native';
|
||||
|
||||
type Assignment = {
|
||||
aId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
deadline: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
sId: string;
|
||||
}
|
||||
|
||||
export default function EditAssignment() {
|
||||
const { aId } = useLocalSearchParams<{ aId: string }>();
|
||||
const [assignment, SetAssignment] = useState<Assignment | null>(null)
|
||||
|
||||
@@ -1,31 +1,11 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Assignment, Task } from '@/lib/types';
|
||||
import { Session } from '@supabase/supabase-js';
|
||||
import { router, Stack, useFocusEffect, useLocalSearchParams } from 'expo-router';
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import { Alert, Button, Pressable, SectionList, Text, View } from "react-native";
|
||||
|
||||
type Assignment = {
|
||||
aId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
deadline: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
sId: string;
|
||||
}
|
||||
|
||||
type Task = {
|
||||
tId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
aId: string;
|
||||
}
|
||||
|
||||
export default function ViewDetailsAssignment() {
|
||||
const { aId } = useLocalSearchParams<{ aId: string }>();
|
||||
const [assignment, SetAssignment] = useState<Assignment | null>(null)
|
||||
@@ -133,6 +113,8 @@ export default function ViewDetailsAssignment() {
|
||||
)
|
||||
}
|
||||
|
||||
const progress = tasks.length === 0 ? 0 : Math.round((tasks.filter(task => task.isCompleted).length / tasks.length) * 100);
|
||||
|
||||
return (
|
||||
<View style={defaultStyles.container}>
|
||||
<Stack.Screen
|
||||
@@ -171,6 +153,27 @@ export default function ViewDetailsAssignment() {
|
||||
<View style={defaultStyles.checkbox}>
|
||||
{assignment.isCompleted && <Text style={defaultStyles.checkboxMark}>✓</Text>}
|
||||
</View>
|
||||
<View style={{ width: "100%", marginTop: 8 }}>
|
||||
<Text style={{ marginBottom: 4 }}>{progress}%</Text>
|
||||
|
||||
<View
|
||||
style={{
|
||||
width: "100%",
|
||||
height: 12,
|
||||
backgroundColor: "#D9D9D9",
|
||||
borderRadius: 999,
|
||||
overflow: "hidden",
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
width: `${progress}%`,
|
||||
height: "100%",
|
||||
backgroundColor: "#4CAF50",
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<Text style={defaultStyles.body}>{assignment.lastChanged}</Text>
|
||||
|
||||
<Button title="Edit" onPress={() => router.push({pathname: "/assignment/editAssignment", params: { aId: assignment.aId }})} />
|
||||
|
||||
@@ -1,18 +1,10 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Subject } from '@/lib/types';
|
||||
import { router, Stack, useFocusEffect, useLocalSearchParams } from 'expo-router';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { ActivityIndicator, Alert, Button, Keyboard, KeyboardAvoidingView, Platform, Pressable, Text, TextInput, TouchableWithoutFeedback, View } from 'react-native';
|
||||
|
||||
type Subject = {
|
||||
sId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isActive: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
}
|
||||
|
||||
export default function EditSubject() {
|
||||
const { sId } = useLocalSearchParams<{ sId: string }>();
|
||||
const [subject, SetSubject] = useState<Subject | null>(null)
|
||||
|
||||
@@ -1,30 +1,11 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Assignment, Subject } from '@/lib/types';
|
||||
import { Session } from '@supabase/supabase-js';
|
||||
import { router, Stack, useFocusEffect, useLocalSearchParams } from 'expo-router';
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import { Alert, Button, Pressable, SectionList, Text, View } from "react-native";
|
||||
|
||||
type Subject = {
|
||||
sId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isActive: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
}
|
||||
|
||||
type Assignment = {
|
||||
aId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
deadline: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
sId: string;
|
||||
}
|
||||
|
||||
export default function ViewDetailsSubject() {
|
||||
const { sId } = useLocalSearchParams<{ sId: string }>();
|
||||
const [subject, SetSubject] = useState<Subject | null>(null)
|
||||
@@ -132,6 +113,10 @@ export default function ViewDetailsSubject() {
|
||||
)
|
||||
}
|
||||
|
||||
const CalculateSubjectCompletion = async () => {
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<View style={defaultStyles.container}>
|
||||
<Stack.Screen
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { CheckAssignmentCompletion } from '@/lib/progress';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import { router, Stack, useLocalSearchParams } from 'expo-router';
|
||||
import { useState } from 'react';
|
||||
@@ -56,6 +57,14 @@ export default function CreateTask() {
|
||||
|
||||
Alert.alert('Task successfully created!');
|
||||
|
||||
if (aId) {
|
||||
try {
|
||||
await CheckAssignmentCompletion(aId);
|
||||
} catch {
|
||||
Alert.alert("Failed to update assignment completion state");
|
||||
}
|
||||
}
|
||||
|
||||
SetTitle('');
|
||||
SetDescription('');
|
||||
SetIsCompleted(false);
|
||||
|
||||
@@ -1,19 +1,11 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { CheckAssignmentCompletion } from '@/lib/progress';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Task } from '@/lib/types';
|
||||
import { router, Stack, useFocusEffect, useLocalSearchParams } from 'expo-router';
|
||||
import { useCallback, useState } from 'react';
|
||||
import { ActivityIndicator, Alert, Button, Keyboard, KeyboardAvoidingView, Platform, Pressable, Text, TextInput, TouchableWithoutFeedback, View } from 'react-native';
|
||||
|
||||
type Task = {
|
||||
tId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
aId: string;
|
||||
}
|
||||
|
||||
export default function EditTask() {
|
||||
const { tId } = useLocalSearchParams<{ tId: string }>();
|
||||
const [task, SetTask] = useState<Task | null>(null)
|
||||
@@ -73,6 +65,14 @@ export default function EditTask() {
|
||||
|
||||
Alert.alert("Task successfully edited!");
|
||||
|
||||
if (task.aId) {
|
||||
try {
|
||||
await CheckAssignmentCompletion(task.aId);
|
||||
} catch {
|
||||
Alert.alert("Failed to update assignment completion state");
|
||||
}
|
||||
}
|
||||
|
||||
router.back();
|
||||
}
|
||||
|
||||
|
||||
@@ -1,20 +1,12 @@
|
||||
import { defaultStyles } from '@/constants/defaultStyles';
|
||||
import { CheckAssignmentCompletion } from '@/lib/progress';
|
||||
import { supabase } from '@/lib/supabase';
|
||||
import type { Task } from '@/lib/types';
|
||||
import { Session } from '@supabase/supabase-js';
|
||||
import { router, Stack, useFocusEffect, useLocalSearchParams } from 'expo-router';
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
import { Alert, Button, Text, View } from "react-native";
|
||||
|
||||
type Task = {
|
||||
tId: string;
|
||||
title: string;
|
||||
description: string;
|
||||
isCompleted: boolean;
|
||||
lastChanged: string;
|
||||
uId: string;
|
||||
aId: string;
|
||||
}
|
||||
|
||||
export default function ViewDetailsTask() {
|
||||
const { tId } = useLocalSearchParams<{ tId: string }>();
|
||||
const [task, SetTask] = useState<Task | null>(null)
|
||||
@@ -69,6 +61,17 @@ export default function ViewDetailsTask() {
|
||||
}
|
||||
|
||||
Alert.alert("Task deleted successfully!");
|
||||
|
||||
const aId = task?.aId;
|
||||
|
||||
if (aId) {
|
||||
try {
|
||||
await CheckAssignmentCompletion(aId);
|
||||
} catch {
|
||||
Alert.alert("Failed to update assignment completion state");
|
||||
}
|
||||
}
|
||||
|
||||
router.back();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user