andoriyaprashant / andoriyaprashant/OpSo

feat: the app has no search functionality — users must scroll through the entire list of open-source programs to find a specific one, with no way to filter by name, eligibility, or stipend range

Đang mở
#486 2 bình luận 0 reaction 1 người được giao Được @prince-pokharna nhận Xem trên GitHub
Ngôn ngữ chính
Dart
Star
53
Fork
108
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

## 🚀 Problem Statement

OpSo's home screen displays a list of open-source programs. As more programs are added (the app already includes GSoC, Summer of Bitcoin, Linux Foundation, MLH, Outreachy, and more), the list grows and scrolling becomes the only way to find a specific program.

There is no search bar, filter chip, or sort option on the home screen. A student who wants to quickly find "programs accepting undergraduates with a stipend" must read every card individually.

This is a significant UX gap given the app's core purpose is helping students discover opportunities.

## Proposed Fix

Add a search bar and filter chips to `lib/screens/home_screen.dart` (or equivalent):

```dart
// lib/screens/home_screen.dart

class HomeScreen extends StatefulWidget { ... }

class _HomeScreenState extends State {
String _searchQuery = '';
String _selectedFilter = 'All'; // 'All', 'With Stipend', 'No Stipend', 'Undergrad'

List get _filteredPrograms {
return allPrograms.where((program) {
final matchesSearch = program.name.toLowerCase()
.contains(_searchQuery.toLowerCase());
final matchesFilter = _selectedFilter == 'All' ||
(program.hasStipend && _selectedFilter == 'With Stipend') ||
(!program.hasStipend && _selectedFilter == 'No Stipend');
return matchesSearch && matchesFilter;
}).toList();
}

@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
// Search bar
Padding(
padding: const EdgeInsets.all(16.0),
child: TextField(
decoration: InputDecoration(
hintText: 'Search programs...',
prefixIcon: const Icon(Icons.search),
suffixIcon: _searchQuery.isNotEmpty
? IconButton(
icon: const Icon(Icons.clear),
onPressed: () => setState(() => _searchQuery = ''),
)
: null,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
),
),
onChanged: (value) => setState(() => _searchQuery = value),
),
),

// Filter chips
SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: ['All', 'With Stipend', 'No Stipend', 'Undergrad OK']
.map((filter) => Padding(
padding: const EdgeInsets.symmetric(horizontal: 4),
child: FilterChip(
label: Text(filter),
selected: _selectedFilter == filter,
onSelected: (_) => setState(() => _selectedFilter = filter),
),
))
.toList(),
),
),

// Program list
Expanded(
child: _filteredPrograms.isEmpty
? const Center(child: Text('No programs match your search'))
: ListView.builder(
itemCount: _filteredPrograms.length,
itemBuilder: (ctx, i) => ProgramCard(_filteredPrograms[i]),
),
),
],
),
);
}
}
```

## Files to Modify

| File | Change |
|---|---|
| `lib/screens/` (home screen) | Add `TextField` search bar and `FilterChip` row |
| `lib/models/program.dart` | Add `hasStipend`, `eligibility` fields used by filter logic |

**Suggested labels:** `enhancement`, `flutter`, `UX`, `good first issue`

I would like to work on this. Could you please assign it to me?

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.