✨ Search post
This commit is contained in:
@ -5,6 +5,7 @@ import 'package:island/screens/developers/apps.dart';
|
||||
import 'package:island/screens/developers/edit_app.dart';
|
||||
import 'package:island/screens/developers/new_app.dart';
|
||||
import 'package:island/screens/developers/hub.dart';
|
||||
import 'package:island/screens/posts/post_search.dart';
|
||||
import 'package:island/widgets/app_wrapper.dart';
|
||||
import 'package:island/screens/tabs.dart';
|
||||
import 'package:island/screens/explore.dart';
|
||||
@ -263,6 +264,10 @@ final routerProvider = Provider<GoRouter>((ref) {
|
||||
path: '/',
|
||||
builder: (context, state) => const ExploreScreen(),
|
||||
),
|
||||
GoRoute(
|
||||
path: '/posts/search',
|
||||
builder: (context, state) => const PostSearchScreen(),
|
||||
),
|
||||
GoRoute(
|
||||
path: '/posts/:id',
|
||||
builder: (context, state) {
|
||||
|
||||
@ -93,37 +93,67 @@ class ExploreScreen extends HookConsumerWidget {
|
||||
extendBody: false, // Prevent conflicts with tabs navigation
|
||||
appBar: AppBar(
|
||||
toolbarHeight: 0,
|
||||
bottom: TabBar(
|
||||
controller: tabController,
|
||||
tabs: [
|
||||
Tab(
|
||||
child: Text(
|
||||
'explore'.tr(),
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
||||
bottom: PreferredSize(
|
||||
preferredSize: const Size.fromHeight(48),
|
||||
child: Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: TabBar(
|
||||
controller: tabController,
|
||||
tabAlignment: TabAlignment.start,
|
||||
isScrollable: true,
|
||||
tabs: [
|
||||
Tab(
|
||||
icon: Tooltip(
|
||||
message: 'explore'.tr(),
|
||||
child: Icon(
|
||||
Symbols.explore,
|
||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
||||
),
|
||||
),
|
||||
),
|
||||
Tab(
|
||||
icon: Tooltip(
|
||||
message: 'exploreFilterSubscriptions'.tr(),
|
||||
child: Icon(
|
||||
Symbols.subscriptions,
|
||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
||||
),
|
||||
),
|
||||
),
|
||||
Tab(
|
||||
icon: Tooltip(
|
||||
message: 'exploreFilterFriends'.tr(),
|
||||
child: Icon(
|
||||
Symbols.people,
|
||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
Tab(
|
||||
child: Text(
|
||||
'exploreFilterSubscriptions'.tr(),
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
Spacer(),
|
||||
IconButton(
|
||||
onPressed: () {},
|
||||
icon: Icon(
|
||||
Symbols.auto_stories,
|
||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
||||
),
|
||||
tooltip: 'webArticlesStand'.tr(),
|
||||
),
|
||||
),
|
||||
Tab(
|
||||
child: Text(
|
||||
'exploreFilterFriends'.tr(),
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
IconButton(
|
||||
onPressed: () {
|
||||
context.push('/posts/search');
|
||||
},
|
||||
icon: Icon(
|
||||
Symbols.search,
|
||||
color: Theme.of(context).appBarTheme.foregroundColor!,
|
||||
),
|
||||
tooltip: 'search'.tr(),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
).padding(horizontal: 8),
|
||||
),
|
||||
),
|
||||
floatingActionButton: FloatingActionButton(
|
||||
|
||||
165
lib/screens/posts/post_search.dart
Normal file
165
lib/screens/posts/post_search.dart
Normal file
@ -0,0 +1,165 @@
|
||||
import 'dart:async';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:island/models/post.dart';
|
||||
import 'package:island/pods/network.dart';
|
||||
import 'package:island/widgets/post/post_item.dart';
|
||||
import 'package:riverpod_paging_utils/riverpod_paging_utils.dart';
|
||||
|
||||
final postSearchNotifierProvider = StateNotifierProvider.autoDispose<
|
||||
PostSearchNotifier,
|
||||
AsyncValue<CursorPagingData<SnPost>>
|
||||
>((ref) => PostSearchNotifier(ref));
|
||||
|
||||
class PostSearchNotifier
|
||||
extends StateNotifier<AsyncValue<CursorPagingData<SnPost>>> {
|
||||
final AutoDisposeRef ref;
|
||||
static const int _pageSize = 20;
|
||||
String _currentQuery = '';
|
||||
bool _isLoading = false;
|
||||
|
||||
PostSearchNotifier(this.ref) : super(const AsyncValue.loading()) {
|
||||
state = const AsyncValue.data(
|
||||
CursorPagingData(items: [], hasMore: false, nextCursor: null),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> search(String query) async {
|
||||
if (_isLoading) return;
|
||||
|
||||
_currentQuery = query.trim();
|
||||
if (_currentQuery.isEmpty) {
|
||||
state = AsyncValue.data(
|
||||
CursorPagingData(items: [], hasMore: false, nextCursor: null),
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
await fetch(cursor: null);
|
||||
}
|
||||
|
||||
Future<void> fetch({String? cursor}) async {
|
||||
if (_isLoading) return;
|
||||
|
||||
_isLoading = true;
|
||||
state = const AsyncValue.loading();
|
||||
|
||||
try {
|
||||
final client = ref.read(apiClientProvider);
|
||||
final offset = cursor == null ? 0 : int.parse(cursor);
|
||||
|
||||
final response = await client.get(
|
||||
'/posts/search',
|
||||
queryParameters: {
|
||||
'query': _currentQuery,
|
||||
'offset': offset,
|
||||
'take': _pageSize,
|
||||
'useVector': true,
|
||||
},
|
||||
);
|
||||
|
||||
final data = response.data as List;
|
||||
final posts = data.map((json) => SnPost.fromJson(json)).toList();
|
||||
final hasMore = posts.length == _pageSize;
|
||||
final nextCursor = hasMore ? (offset + posts.length).toString() : null;
|
||||
|
||||
state = AsyncValue.data(
|
||||
CursorPagingData(
|
||||
items: posts,
|
||||
hasMore: hasMore,
|
||||
nextCursor: nextCursor,
|
||||
),
|
||||
);
|
||||
} catch (e, stack) {
|
||||
state = AsyncValue.error(e, stack);
|
||||
} finally {
|
||||
_isLoading = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
class PostSearchScreen extends ConsumerStatefulWidget {
|
||||
const PostSearchScreen({super.key});
|
||||
|
||||
@override
|
||||
ConsumerState<PostSearchScreen> createState() => _PostSearchScreenState();
|
||||
}
|
||||
|
||||
class _PostSearchScreenState extends ConsumerState<PostSearchScreen> {
|
||||
final _searchController = TextEditingController();
|
||||
final _debounce = Duration(milliseconds: 500);
|
||||
Timer? _debounceTimer;
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_searchController.dispose();
|
||||
_debounceTimer?.cancel();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _onSearchChanged(String query) {
|
||||
if (_debounceTimer?.isActive ?? false) _debounceTimer!.cancel();
|
||||
|
||||
_debounceTimer = Timer(_debounce, () {
|
||||
ref.read(postSearchNotifierProvider.notifier).search(query);
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: TextField(
|
||||
controller: _searchController,
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search posts...',
|
||||
border: InputBorder.none,
|
||||
hintStyle: TextStyle(
|
||||
color: Theme.of(context).appBarTheme.foregroundColor,
|
||||
),
|
||||
),
|
||||
style: TextStyle(
|
||||
color: Theme.of(context).appBarTheme.foregroundColor,
|
||||
),
|
||||
onChanged: _onSearchChanged,
|
||||
onSubmitted: (value) {
|
||||
ref.read(postSearchNotifierProvider.notifier).search(value);
|
||||
},
|
||||
autofocus: true,
|
||||
),
|
||||
),
|
||||
body: Consumer(
|
||||
builder: (context, ref, child) {
|
||||
final searchState = ref.watch(postSearchNotifierProvider);
|
||||
|
||||
return searchState.when(
|
||||
data: (data) {
|
||||
if (data.items.isEmpty && _searchController.text.isNotEmpty) {
|
||||
return const Center(child: Text('No results found'));
|
||||
}
|
||||
|
||||
return ListView.builder(
|
||||
itemCount: data.items.length + (data.hasMore ? 1 : 0),
|
||||
itemBuilder: (context, index) {
|
||||
if (index >= data.items.length) {
|
||||
ref
|
||||
.read(postSearchNotifierProvider.notifier)
|
||||
.fetch(cursor: data.nextCursor);
|
||||
return const Center(child: CircularProgressIndicator());
|
||||
}
|
||||
|
||||
final post = data.items[index];
|
||||
return Column(
|
||||
children: [PostItem(item: post), const Divider(height: 1)],
|
||||
);
|
||||
},
|
||||
);
|
||||
},
|
||||
loading: () => const Center(child: CircularProgressIndicator()),
|
||||
error: (error, stack) => Center(child: Text('Error: $error')),
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user