Conversation
|
[diff-counting] Significant lines: 2662. This diff might be too big! Developer leads are invited to review the code. |
parsa-tehranipoor
left a comment
There was a problem hiding this comment.
Although just a WIP PR, this is a great first step towards the larger admin data manipulation feature. The code is organized very well and well written. No current comments on the code or logic. Good job!
\ - Implemented apartment information edit endpoint - Implemented create new apartment endpoint - Implemented admin page apartment pagination, sorting, and editing functionalities
laurenp-2
left a comment
There was a problem hiding this comment.
This looks great, the admin page structure is coming together well. I've left a few comments on small things I noticed—mainly some error handling for the apartments data loading, a type safety improvement (using ApartmentData[] instead of any[]), and a couple of efficiency suggestions. Excited to see the full admin dashboard come together!
|
|
||
| // Use the same API endpoint as AdminPage | ||
| const response = await axios.get<ApiResponse>( | ||
| 'http://localhost:8080/api/page-data/home/1000/numReviews' |
There was a problem hiding this comment.
Error message says localhost:3000 but the code uses localhost:8080.
| const host = req.get('host'); | ||
| const baseUrl = `${protocol}://${host}`; | ||
|
|
||
| const travelTimesResponse = await axios.post(`${baseUrl}/api/calculate-travel-times`, { |
There was a problem hiding this comment.
Extracting the travel time calculation logic into a shared function could prevent an unnecessary HTTP request which might be more efficient
| const [reportedData, setReportedData] = useState<ReviewWithId[]>([]); | ||
| const [reportedExpanded, setReportedExpanded] = useState(true); | ||
| const { container, sectionHeader, expand, expandOpen } = useStyles(); | ||
| const [apartments, setApartments] = useState<any[]>([]); |
There was a problem hiding this comment.
should use ApartmentData[] instead of any[]
| if (data && data.buildingData && Array.isArray(data.buildingData)) { | ||
| setApartments(data.buildingData); | ||
| } else { | ||
| console.error('Failed to load apartments data'); |
There was a problem hiding this comment.
This is missing error handling to let the user know if something went wrong
|
This is a really strong PR overall. The new Admin Data Editor adds a lot of practical functionality, from apartment pagination and inline editing to new admin-only endpoints that support secure apartment creation and updates. The backend routes are well-structured, with clear validation and consistent error handling, and the front-end flow feels intuitive with good use of optimistic updates and sorting logic. That said, there are a few fixes needed before merge: the Firestore query in add-apartment uses multi-field range filters on both latitude and longitude, which Firestore doesn’t support—you’ll need a geospatial workaround. The backend should also move admins out of the frontend constants, rename REACT_APP_MAPS_API_KEY to a server-only key, and call the travel-time logic directly instead of making an HTTP request to itself. Finally, return 201 for successful apartment creation and 200 for preliminary confirmations. Once those issues are addressed, this will be a great, production-ready addition. |
Backend Changes:
- Add RoomType interface with UUID-based IDs (beds, baths, price)
- Replace single numBeds/numBaths/price fields with roomTypes array
- Add migration endpoint POST /api/admin/migrate-all-apartments-schema
- Supports dry run mode for preview
- Batch processing (100 apartments per batch)
- Initializes roomTypes as empty array and removes old fields
- Update PUT /api/admin/update-apartment to handle roomTypes
- Generate UUIDs for new room types
- Validate beds/baths/price >= 1 (integers only)
- Check for duplicate room type combinations
- Update POST /api/admin/add-apartment to accept roomTypes
- Same validation and UUID generation
- Allow empty roomTypes array
- Update add_buildings.ts script to use new schema
Frontend Changes (Temporary):
- Comment out old bed/bath/price displays in ApartmentCard
- Comment out bed display in NewApartmentCard
- Update price sorting to use avgPrice temporarily
- Proper room type display will be implemented in future commits
- Proper room type sorting will be implemented in future commits
Note: All apartments will start with empty roomTypes after migration.
Frontend integer validation for admin UI will be added in following commits.
Admin Page Room Type Management
- Added room types editing modal with table UI for beds/baths/price
- Displays existing room types with inline editing and delete functionality
- Includes "Add Room Type" button with validation (>= 1 for all fields)
- Checks for duplicate room types (same beds/baths/price combination)
- Backend generates UUIDs for new room types automatically
- Shows room type count in Data tab instead of old numBeds/numBaths fields
- Displays room type IDs (truncated) for debugging
Room Type Display Utilities and Card Updates
- Created roomTypeUtils.ts with comprehensive display functions:
- formatPrice: Formats prices with K suffix (e.g., $1.5K, $3K)
- formatBeds/formatBaths: Formats bed/bath counts (e.g., "2 beds", "1 bath")
- getRoomTypeRange: Gets min/max values for beds/baths/price
- formatPriceRange: Formats price ranges (e.g., "$1.5K - $3K")
- formatRoomTypesDisplay: Complete display string for cards
- getMinPrice/getMaxPrice: Helper functions for sorting
- Updated NewApartmentCard to display dynamic price ranges from room types
- Shows "Coming soon" when no room types are available
- Update ApartmentCard component to display room type information
- Add imports for formatPriceRange, formatBedsRange, getRoomTypeRange utilities
- Replace TODO section with dynamic room types display
- Show "Coming soon" message for apartments with empty roomTypes
- Display formatted price and bed ranges for apartments with room types data
- Implement comprehensive search filtering with room types support
- Re-enable price, bedroom, and bathroom filter parameters
- Add exact match filtering for beds/baths (not >=)
- Implement additional search result sections (location, price, bed/bath)
- Return structured response with main results + 3 additional sections
- Filter apartments based on roomTypes array instead of old schema
- Handle empty roomTypes arrays in filter logic
- Update search results page to support additional sections
- Add state variables for additionalLocation, additionalPrice, additionalBedBath
- Prepare frontend for displaying multiple result sections
- Enhance apartment sorting with room types
- Use getMinPrice/getMaxPrice utilities for sorting by price
- Sort by minimum price (cheapest) or maximum price (most expensive)
- Handle apartments with empty roomTypes arrays
This completes the frontend display implementation for the room types refactor.
Backend migration tools and admin CRUD are already in place from previous commits.
Ready for data migration and testing.
…ayout
- Rename "Data" tab to "Apartment Data" for clarity
- Remove test apartments pagination and filtering logic
- Add real-time search functionality:
- Search by apartment name
- Search by apartment address
- Both searches reset pagination to first page
- Add room types filter dropdown:
- All Apartments (default)
- With Room Types (show only apartments with room types data)
- Without Room Types (show only apartments missing room types)
- Reorganize apartment display with horizontal card layout:
- Replace vertical list with compact card-based design
- Organize information in 3 responsive columns (Location, Details, Stats)
- Add visual distinction for apartments without room types (gray italic)
- Position edit button in top-right corner of each card
- Reduce vertical space usage by ~50%
- Update display counter to show filtered vs total apartment counts
- Simplify pagination logic by removing test apartment handling
- Improve visual hierarchy with section labels and consistent spacing
This makes it easier for admins to find and manage apartments,
especially when populating room types data after migration.
- Add "Create New Apartment" button in Apartment Data tab header
- Implement two-step apartment creation workflow:
1. Preview mode: Calculate location data from address
2. Confirm mode: Create apartment in database
- Create modal dialog with required fields:
- Apartment Name (text input)
- Full Address (text input with geocoding support)
- Landlord ID (text input)
- Area (dropdown: Collegetown, West, North, Downtown, Other)
- Display preview of calculated location data before creation:
- Show latitude and longitude from geocoded address
- Show calculated distance to campus
- Confirm before final creation
- Add comprehensive error handling and validation:
- Form validation for required fields
- Backend error display in modal
- Loading states for preview and create actions
- Integrate with existing `/api/admin/add-apartment` endpoint
- Endpoint automatically geocodes address to get coordinates
- Calculates walking distance to Ho Plaza
- Validates landlord exists
- Checks for duplicate locations
- Auto-reload apartment list after successful creation
- Show success message with generated apartment ID
This streamlines the apartment creation process for admins by
automating location data calculation and providing validation
before committing changes to the database.
- Persist filter state and query text across search navigation - Auto-close autocomplete dropdown after search submission - Add red color indicator for active filter sections on search results page - Improve search results layout: scrollable apartment list (3/5 width) with sticky map (2/5 width, max 650px) - Reduce apartment card gaps (6px column, 12px row) and fix clickable regions - Show empty state message when no exact matches found - Only display "No search results" in autocomplete when user has typed text
Summary
This pull request is the first step towards implementing feature of allowing the admins of CUAPTS to add, edit, delete apartment, reviews, and landlord data from the application through UI. This would simplify the data changing process, making data change a feature rather than a development chores. This feature will also allow more dynamic response to newly found apartments, as we could reflect these findings quickly on the website.
Test Plan
Notes
Breaking Changes