Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NW6 | nazanin_Saedi | Feature-sort-table-column | reactProject | Week4 #51

Open
wants to merge 7 commits into
base: main
Choose a base branch
from

Conversation

nazaninsaedi
Copy link
Collaborator

Learners, PR Template

Self checklist

  • I have committed my files one by one, on purpose, and for a reason
  • I have titled my PR with COHORT_NAME | FIRST_NAME LAST_NAME | REPO_NAME | WEEK
  • I have tested my changes
  • My changes follow the style guide
  • My changes meet the requirements of this task

Changelist

Briefly explain your PR.

Questions

Ask any questions you have for your reviewer.

Copy link

netlify bot commented Mar 20, 2024

Deploy Preview for react-module-project-nw6-team-2 ready!

Name Link
🔨 Latest commit 7bca420
🔍 Latest deploy log https://app.netlify.com/sites/react-module-project-nw6-team-2/deploys/65fcb29d629d6400084ccefa
😎 Deploy Preview https://deploy-preview-51--react-module-project-nw6-team-2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

@Ara225 Ara225 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking good and it works well. My main suggestion would be to add some arrows on the column headers so that users can see if it's currently sorted by that column and if so what direction

direction = 'descending';
}
setSortConfig({ key, direction });
};
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking good, like how you support sorting in both directions



// Sorting function based on the current sort configuration
const sortedBookings = [...Bookings].sort((a, b) => {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You should be able to do Bookings.sort here. Any particular reason you're done it this way?

// Convert string room IDs to numbers for proper sorting
aValue = parseInt(aValue);
bValue = parseInt(bValue);
}
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

THis is a good touch 👍


const sortOrder = sortConfig.direction === 'ascending' ? 1 : -1;
return aValue - bValue * sortOrder;
});
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code could use a comment here - not easy to tell what it does

<th onClick={() => handleSort('roomId')}>Room ID</th>
<th onClick={() => handleSort('checkInDate')}>Check In Date</th>
<th onClick={() => handleSort('checkOutDate')}>Check Out Date</th>
</tr>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This works however and idea for next time: it's worth thinking about using .map() on an array for these sorts of things - can make it tider thouht this is up to your prefrence

@@ -22,5 +22,5 @@ th {
cursor: pointer;
}
.selected {
background-color: skyblue;
background-color: rgb(241, 176, 249);
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice touch.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants