🎨 Use feature based folder structure
This commit is contained in:
106
lib/realms/realms_widgets/realm/realm_card.dart
Normal file
106
lib/realms/realms_widgets/realm/realm_card.dart
Normal file
@@ -0,0 +1,106 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:gap/gap.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:island/realms/realms_models/realm.dart';
|
||||
import 'package:island/drive/drive_widgets/cloud_files.dart';
|
||||
import 'package:material_symbols_icons/symbols.dart';
|
||||
|
||||
class RealmDiscoveryCard extends ConsumerWidget {
|
||||
final SnRealm realm;
|
||||
final double? maxWidth;
|
||||
|
||||
const RealmDiscoveryCard({super.key, required this.realm, this.maxWidth});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
Widget imageWidget;
|
||||
if (realm.picture != null) {
|
||||
imageWidget = imageWidget = CloudImageWidget(
|
||||
file: realm.background,
|
||||
fit: BoxFit.cover,
|
||||
);
|
||||
} else {
|
||||
imageWidget = ColoredBox(
|
||||
color: Theme.of(context).colorScheme.secondaryContainer,
|
||||
);
|
||||
}
|
||||
|
||||
Widget card = Card(
|
||||
clipBehavior: Clip.antiAlias,
|
||||
margin: EdgeInsets.zero,
|
||||
child: InkWell(
|
||||
onTap: () {
|
||||
context.pushNamed(
|
||||
'realmDetail',
|
||||
pathParameters: {'slug': realm.slug},
|
||||
);
|
||||
},
|
||||
child: AspectRatio(
|
||||
aspectRatio: 16 / 7,
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
imageWidget,
|
||||
Positioned(
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.bottomCenter,
|
||||
end: Alignment.topCenter,
|
||||
colors: [
|
||||
Colors.black.withOpacity(0.7),
|
||||
Colors.transparent,
|
||||
],
|
||||
),
|
||||
),
|
||||
padding: const EdgeInsets.all(8),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Container(
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.5),
|
||||
blurRadius: 4,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: ProfilePictureWidget(
|
||||
file: realm.picture,
|
||||
fallbackIcon: Symbols.group,
|
||||
radius: 12,
|
||||
),
|
||||
),
|
||||
const Gap(2),
|
||||
Text(
|
||||
realm.name,
|
||||
style: Theme.of(context).textTheme.titleSmall?.copyWith(
|
||||
color: Colors.white,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
return ConstrainedBox(
|
||||
constraints: BoxConstraints(maxWidth: maxWidth ?? double.infinity),
|
||||
child: card,
|
||||
);
|
||||
}
|
||||
}
|
||||
78
lib/realms/realms_widgets/realm/realm_list.dart
Normal file
78
lib/realms/realms_widgets/realm/realm_list.dart
Normal file
@@ -0,0 +1,78 @@
|
||||
import 'dart:async';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:island/pagination/pagination.dart';
|
||||
import 'package:island/realms/realms_models/realm.dart';
|
||||
import 'package:island/core/network.dart';
|
||||
import 'package:island/realms/realms_widgets/realm/realm_list_tile.dart';
|
||||
import 'package:island/shared/widgets/pagination_list.dart';
|
||||
import 'package:styled_widget/styled_widget.dart';
|
||||
|
||||
final realmListNotifierProvider = AsyncNotifierProvider.autoDispose.family(
|
||||
RealmListNotifier.new,
|
||||
);
|
||||
|
||||
class RealmListNotifier extends AsyncNotifier<PaginationState<SnRealm>>
|
||||
with AsyncPaginationController<SnRealm> {
|
||||
String? arg;
|
||||
RealmListNotifier(this.arg);
|
||||
|
||||
static const int _pageSize = 20;
|
||||
|
||||
@override
|
||||
FutureOr<PaginationState<SnRealm>> build() async {
|
||||
final items = await fetch();
|
||||
return PaginationState(
|
||||
items: items,
|
||||
isLoading: false,
|
||||
isReloading: false,
|
||||
totalCount: totalCount,
|
||||
hasMore: hasMore,
|
||||
cursor: cursor,
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Future<List<SnRealm>> fetch() async {
|
||||
final client = ref.read(apiClientProvider);
|
||||
|
||||
final queryParams = {
|
||||
'offset': fetchedCount,
|
||||
'take': _pageSize,
|
||||
if (arg != null && arg!.isNotEmpty) 'query': arg,
|
||||
};
|
||||
|
||||
final response = await client.get(
|
||||
'/pass/realms/public',
|
||||
queryParameters: queryParams,
|
||||
);
|
||||
totalCount = int.parse(response.headers.value('X-Total') ?? '0');
|
||||
final List<dynamic> data = response.data;
|
||||
return data.map((json) => SnRealm.fromJson(json)).toList();
|
||||
}
|
||||
}
|
||||
|
||||
class SliverRealmList extends HookConsumerWidget {
|
||||
const SliverRealmList({super.key, this.query});
|
||||
|
||||
final String? query;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final provider = realmListNotifierProvider(query);
|
||||
return PaginationList(
|
||||
provider: provider,
|
||||
notifier: provider.notifier,
|
||||
isSliver: true,
|
||||
isRefreshable: false,
|
||||
spacing: 8,
|
||||
itemBuilder: (context, index, realm) {
|
||||
return ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: 540),
|
||||
child: RealmListTile(realm: realm).padding(horizontal: 8),
|
||||
).center();
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
75
lib/realms/realms_widgets/realm/realm_list_tile.dart
Normal file
75
lib/realms/realms_widgets/realm/realm_list_tile.dart
Normal file
@@ -0,0 +1,75 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:gap/gap.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:island/realms/realms_models/realm.dart';
|
||||
import 'package:island/drive/drive_widgets/cloud_files.dart';
|
||||
import 'package:material_symbols_icons/symbols.dart';
|
||||
import 'package:styled_widget/styled_widget.dart';
|
||||
|
||||
class RealmListTile extends StatelessWidget {
|
||||
const RealmListTile({super.key, required this.realm});
|
||||
|
||||
final SnRealm realm;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Card(
|
||||
margin: EdgeInsets.zero,
|
||||
child: InkWell(
|
||||
borderRadius: const BorderRadius.all(Radius.circular(8)),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
AspectRatio(
|
||||
aspectRatio: 16 / 7,
|
||||
child: Stack(
|
||||
clipBehavior: Clip.none,
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
ClipRRect(
|
||||
borderRadius: const BorderRadius.all(Radius.circular(8)),
|
||||
child: Container(
|
||||
color: Theme.of(context).colorScheme.surfaceContainer,
|
||||
child: realm.background == null
|
||||
? const SizedBox.shrink()
|
||||
: CloudImageWidget(file: realm.background),
|
||||
),
|
||||
),
|
||||
Positioned(
|
||||
bottom: -30,
|
||||
left: 18,
|
||||
child: ProfilePictureWidget(
|
||||
file: realm.picture,
|
||||
fallbackIcon: Symbols.group,
|
||||
radius: 24,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const Gap(20 + 12),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
realm.name,
|
||||
).textStyle(Theme.of(context).textTheme.titleMedium!),
|
||||
Text(
|
||||
realm.description,
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
).textStyle(Theme.of(context).textTheme.bodySmall!),
|
||||
],
|
||||
).padding(horizontal: 24, bottom: 14),
|
||||
],
|
||||
),
|
||||
onTap: () {
|
||||
context.pushNamed(
|
||||
'realmDetail',
|
||||
pathParameters: {'slug': realm.slug},
|
||||
);
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,70 @@
|
||||
import 'package:dropdown_button2/dropdown_button2.dart';
|
||||
import 'package:easy_localization/easy_localization.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:island/realms/realms_models/realm.dart';
|
||||
import 'package:island/drive/drive_widgets/cloud_files.dart';
|
||||
import 'package:material_symbols_icons/symbols.dart';
|
||||
|
||||
class RealmSelectionDropdown extends StatelessWidget {
|
||||
final SnRealm? value;
|
||||
final List<SnRealm> realms;
|
||||
final ValueChanged<SnRealm?> onChanged;
|
||||
final bool isLoading;
|
||||
final String? error;
|
||||
|
||||
const RealmSelectionDropdown({
|
||||
super.key,
|
||||
required this.value,
|
||||
required this.realms,
|
||||
required this.onChanged,
|
||||
this.isLoading = false,
|
||||
this.error,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return DropdownButtonHideUnderline(
|
||||
child: DropdownButton2<SnRealm?>(
|
||||
isExpanded: true,
|
||||
hint: Text('realmSelection').tr(),
|
||||
value: value,
|
||||
items: [
|
||||
DropdownMenuItem<SnRealm?>(
|
||||
value: null,
|
||||
child: Row(
|
||||
children: [
|
||||
const CircleAvatar(
|
||||
radius: 16,
|
||||
child: Icon(Symbols.person, fill: 1),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text('individual').tr(),
|
||||
],
|
||||
),
|
||||
),
|
||||
if (!isLoading && error == null)
|
||||
...realms.map(
|
||||
(realm) => DropdownMenuItem<SnRealm?>(
|
||||
value: realm,
|
||||
child: Row(
|
||||
children: [
|
||||
ProfilePictureWidget(
|
||||
file: realm.picture,
|
||||
fallbackIcon: Symbols.workspaces,
|
||||
radius: 16,
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(realm.name),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
onChanged: onChanged,
|
||||
buttonStyleData: const ButtonStyleData(
|
||||
padding: EdgeInsets.only(left: 4, right: 16),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
20
lib/realms/realms_widgets/realm/realm_tile.dart
Normal file
20
lib/realms/realms_widgets/realm/realm_tile.dart
Normal file
@@ -0,0 +1,20 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:island/realms/realms_models/realm.dart';
|
||||
import 'package:island/drive/drive_widgets/cloud_files.dart';
|
||||
|
||||
class RealmTile extends HookConsumerWidget {
|
||||
final SnRealm realm;
|
||||
const RealmTile({super.key, required this.realm});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
return ListTile(
|
||||
leading: ProfilePictureWidget(file: realm.picture),
|
||||
title: Text(realm.name),
|
||||
subtitle: Text(realm.description),
|
||||
onTap: () => context.pushNamed('realmDetail', pathParameters: {'slug': realm.slug}),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user