Small refinement to assignments (#322)

* small changes * sorts players alphabetically for assignment player view
Golf-Drill-Challenge-App · Aug 19, 2024 · 925028f · 925028f
1 parent fc07050
commit 925028f
Show file tree

Hide file tree

Showing 4 changed files with 95 additions and 86 deletions.
diff --git a/app/content/assignments/index.js b/app/content/assignments/index.js
@@ -72,9 +72,11 @@ export default function Index() {
  <Header title="Assigned Drills" />
  <AssignmentsList
  role={userInfo["role"]}
+ singleUser={userInfo["role"] === "player"}
  playerInfo={userInfo["role"] === "player" ? [userInfo] : playerInfo}
  invalidateKeys={invalidateKeys}
  drillInfo={drillInfo}
+ disableCriteria={({ completed, hasStats }) => completed && !hasStats}
  />
  </SafeAreaView>
  );

diff --git a/app/content/assignments/players.js b/app/content/assignments/players.js
@@ -305,87 +305,90 @@ function Index() {
  }}
  >
  <List.Section style={{ backgroundColor: themeColors.background }}>
- {assignmentList.map((assignment) => {
- return (
- <List.Item
- key={`${assignment.uid}`}
- onPress={async () => {
- if (editing) {
- //toggle markedForDelete
- setAssignmentList((prevAssignmentList) => {
- return prevAssignmentList.map((prevAssignment) => {
- if (prevAssignment.uid === assignment.uid) {
- return {
- ...prevAssignment,
- markedForDelete: !prevAssignment.markedForDelete,
- };
- }
- return prevAssignment;
+ {assignmentList
+ .sort((a, b) => a.name.localeCompare(b.name))
+ .map((assignment) => {
+ return (
+ <List.Item
+ key={`${assignment.uid}`}
+ onPress={async () => {
+ if (editing) {
+ //toggle markedForDelete
+ setAssignmentList((prevAssignmentList) => {
+ return prevAssignmentList.map((prevAssignment) => {
+ if (prevAssignment.uid === assignment.uid) {
+ return {
+ ...prevAssignment,
+ markedForDelete:
+ !prevAssignment.markedForDelete,
+ };
+ }
+ return prevAssignment;
+ });
  });
- });
- } else {
- await handleAssignmentPress(assignment);
+ } else {
+ await handleAssignmentPress(assignment);
+ }
+ }}
+ disabled={
+ !editing && (!assignment.completed || !drillInfo.hasStats)
  }
- }}
- disabled={
- !editing && (!assignment.completed || !drillInfo.hasStats)
- }
- style={{
- paddingLeft: 20,
- }}
- left={() => (
- <ProfilePicture
- userInfo={assignment}
- style={{
- width: 24,
- height: 24,
- borderRadius: 12,
- }}
- />
- )}
- right={() => (
- <View
- style={{
- flexDirection: "row",
- alignItems: "center",
- }}
- >
- {editing ? (
- assignment.markedForDelete ? (
- <Icon
- source="checkbox-outline"
- size={20}
- color={"black"}
- />
+ style={{
+ paddingLeft: 20,
+ }}
+ left={() => (
+ <ProfilePicture
+ userInfo={assignment}
+ style={{
+ width: 24,
+ height: 24,
+ borderRadius: 12,
+ }}
+ />
+ )}
+ right={() => (
+ <View
+ style={{
+ flexDirection: "row",
+ alignItems: "center",
+ }}
+ >
+ {editing ? (
+ assignment.markedForDelete ? (
+ <Icon
+ source="checkbox-outline"
+ size={20}
+ color={"black"}
+ />
+ ) : (
+ <Icon
+ source="checkbox-blank-outline"
+ size={20}
+ color={"black"}
+ />
+ )
  ) : (
- <Icon
- source="checkbox-blank-outline"
- size={20}
- color={"black"}
- />
- )
- ) : (
- assignment.completed && (
- <>
- <Text
- style={{
- color: "green",
- }}
- >
- Completed
- </Text>
- {drillInfo.hasStats && (
- <Icon size={20} source="chevron-right" />
- )}
- </>
- )
- )}
- </View>
- )}
- title={assignment.name}
- />
- );
- })}
+ assignment.completed && (
+ <>
+ <Text
+ style={{
+ color: "green",
+ }}
+ >
+ Completed
+ </Text>
+ {drillInfo.hasStats && (
+ <Icon size={20} source="chevron-right" />
+ )}
+ </>
+ )
+ )}
+ </View>
+ )}
+ title={assignment.name}
+ />
+ );
+ })}
  </List.Section>
  </View>
  </ScrollView>

diff --git a/app/content/team/users/[user]/index.js b/app/content/team/users/[user]/index.js
@@ -204,6 +204,7 @@ function Index() {
  const AssignmentScreen = () => (
  <AssignmentsList
  role={currentUserInfo["role"]}
+ singleUser={true}
  playerInfo={[userInfo]}
  drillInfo={drillInfo}
  disableCriteria={({ completed, hasStats }) => !completed || !hasStats}

diff --git a/components/assignmentList.js b/components/assignmentList.js
@@ -13,6 +13,7 @@ import { useTimeContext } from "~/context/Time";
 
 const AssignmentsList = ({
  role,
+ singleUser,
  playerInfo,
  invalidateKeys,
  drillInfo,
@@ -21,8 +22,6 @@ const AssignmentsList = ({
 }) => {
  const currentPath = usePathname();
 
- const singleUser = playerInfo.length === 1;
-
  const { getLocalizedDate, getCurrentLocalizedDate } = useTimeContext();
 
  const assigned_data = useMemo(() => {
@@ -95,9 +94,10 @@ const AssignmentsList = ({
  debounce(
  (assignment) => {
  if (singleUser) {
- if (assignment.completed) {
+ //since singleUser
+ if (assignment["players"][0].completed) {
  router.push({
- pathname: `${currentPath}/attempts/${assignment.attemptId}`,
+ pathname: `${currentPath}/attempts/${assignment["players"][0].attemptId}`,
  params: {
  id: assignment.drillId,
  },
@@ -111,7 +111,7 @@ const AssignmentsList = ({
  currentTime: new Date(),
  },
  });
- }
+ } //else disabled
  } else {
  router.push({
  pathname: "content/assignments/players",
@@ -207,8 +207,11 @@ const AssignmentsList = ({
  keyExtractor={(item) => `${item.assignedTime}-${item.drillId}`}
  ListHeaderComponent={children}
  renderItem={({ item: assignment }) => {
+ const assignmentCompleted = singleUser
+ ? assignment["players"][0].completed
+ : false;
  const disabled = disableCriteria({
- completed: !!assignment.completed,
+ completed: assignmentCompleted,
  hasStats: drillInfo[assignment.drillId].hasStats,
  });
  return (
@@ -220,7 +223,7 @@ const AssignmentsList = ({
  <AssignmentCard
  mainText={drillInfo[assignment.drillId]["subType"]}
  subText={drillInfo[assignment.drillId]["drillType"]}
- completed={assignment.completed}
+ completed={assignmentCompleted}
  pfp={singleUser ? null : stackedPfp(assignment["players"])}
  disabled={disabled}
  />
@@ -239,7 +242,7 @@ const AssignmentsList = ({
  backgroundColor: themeColors.background,
  }}
  >
- {title === getCurrentLocalizedDate({ rounded: true })
+ {title == getCurrentLocalizedDate({ rounded: true }).getTime()
  ? "Today"
  : formatDate(title)}
  </Text>