You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
275 lines
12 KiB
Dart
275 lines
12 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
import 'package:go_router/go_router.dart';
|
|
|
|
import 'package:fluffychat/config/themes.dart';
|
|
import 'package:fluffychat/l10n/l10n.dart';
|
|
import 'package:fluffychat/pangea/common/widgets/error_indicator.dart';
|
|
import 'package:fluffychat/pangea/find_your_people/find_your_people.dart';
|
|
import 'package:fluffychat/pangea/find_your_people/public_space_tile.dart';
|
|
import 'package:fluffychat/pangea/spaces/utils/space_code.dart';
|
|
|
|
class FindYourPeopleView extends StatelessWidget {
|
|
final FindYourPeopleState controller;
|
|
|
|
const FindYourPeopleView({
|
|
super.key,
|
|
required this.controller,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final theme = Theme.of(context);
|
|
final isColumnMode = FluffyThemes.isColumnMode(context);
|
|
|
|
return Scaffold(
|
|
appBar: isColumnMode
|
|
? null
|
|
: AppBar(
|
|
leading: IconButton(
|
|
icon: Icon(
|
|
Icons.chevron_left,
|
|
color: theme.colorScheme.primary,
|
|
),
|
|
onPressed: () => Navigator.of(context).pop(),
|
|
),
|
|
title: Icon(
|
|
Icons.groups_outlined,
|
|
size: 24.0,
|
|
color: theme.colorScheme.primary,
|
|
),
|
|
centerTitle: false,
|
|
leadingWidth: 48.0,
|
|
actions: [
|
|
TextButton(
|
|
child: Row(
|
|
children: [
|
|
Icon(
|
|
Icons.join_full,
|
|
color: theme.colorScheme.primary,
|
|
size: 24.0,
|
|
),
|
|
const SizedBox(width: 8.0),
|
|
Text(
|
|
L10n.of(context).joinWithCode,
|
|
style: TextStyle(
|
|
color: theme.colorScheme.primary,
|
|
fontSize: 14.0,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
onPressed: () =>
|
|
SpaceCodeUtil.joinWithSpaceCodeDialog(context),
|
|
),
|
|
],
|
|
),
|
|
floatingActionButton: isColumnMode
|
|
? null
|
|
: FloatingActionButton.extended(
|
|
onPressed: () => context.push('/rooms/newspace'),
|
|
icon: const Icon(Icons.add_box_outlined),
|
|
label: Text(
|
|
L10n.of(context).space,
|
|
overflow: TextOverflow.fade,
|
|
),
|
|
),
|
|
body: Padding(
|
|
padding: isColumnMode
|
|
? const EdgeInsets.symmetric(
|
|
horizontal: 24.0,
|
|
vertical: 20.0,
|
|
)
|
|
: const EdgeInsets.all(12.0),
|
|
child: Column(
|
|
spacing: 16.0,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
if (isColumnMode)
|
|
Padding(
|
|
padding: const EdgeInsets.symmetric(
|
|
vertical: 16.0,
|
|
horizontal: 12.0,
|
|
),
|
|
child: Text(
|
|
L10n.of(context).findYourPeople,
|
|
style: const TextStyle(fontSize: 32.0),
|
|
),
|
|
),
|
|
Expanded(
|
|
child: Column(
|
|
spacing: isColumnMode ? 32.0 : 16.0,
|
|
children: [
|
|
LayoutBuilder(
|
|
builder: (context, constraints) {
|
|
return SizedBox(
|
|
width: constraints.maxWidth,
|
|
child: Wrap(
|
|
alignment: WrapAlignment.spaceBetween,
|
|
spacing: 10,
|
|
runSpacing: 10,
|
|
children: [
|
|
ConstrainedBox(
|
|
constraints: isColumnMode
|
|
? const BoxConstraints(
|
|
minWidth: 200.0,
|
|
maxWidth: 400.0,
|
|
)
|
|
: BoxConstraints(
|
|
maxWidth:
|
|
MediaQuery.of(context).size.width -
|
|
24.0,
|
|
),
|
|
child: SizedBox(
|
|
height: 40.0,
|
|
width: isColumnMode ? 300.0 : null,
|
|
child: TextField(
|
|
controller: controller.searchController,
|
|
onChanged: controller.onSearchEnter,
|
|
textInputAction: TextInputAction.search,
|
|
decoration: InputDecoration(
|
|
filled: !isColumnMode,
|
|
fillColor: isColumnMode
|
|
? null
|
|
: theme.colorScheme.secondaryContainer,
|
|
border: OutlineInputBorder(
|
|
borderSide: isColumnMode
|
|
? const BorderSide()
|
|
: BorderSide.none,
|
|
borderRadius: BorderRadius.circular(100),
|
|
),
|
|
contentPadding: const EdgeInsets.fromLTRB(
|
|
0,
|
|
0,
|
|
20.0,
|
|
0,
|
|
),
|
|
hintText: L10n.of(context).findYourPeople,
|
|
hintStyle: TextStyle(
|
|
color:
|
|
theme.colorScheme.onPrimaryContainer,
|
|
fontWeight: FontWeight.normal,
|
|
fontSize: 16.0,
|
|
),
|
|
floatingLabelBehavior:
|
|
FloatingLabelBehavior.never,
|
|
prefixIcon: IconButton(
|
|
onPressed: () {},
|
|
icon: Icon(
|
|
Icons.search_outlined,
|
|
color: theme
|
|
.colorScheme.onPrimaryContainer,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
if (isColumnMode)
|
|
Row(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
TextButton(
|
|
child: Row(
|
|
children: [
|
|
Icon(
|
|
Icons.join_full,
|
|
color: theme
|
|
.colorScheme.onPrimaryContainer,
|
|
size: 24.0,
|
|
),
|
|
const SizedBox(width: 8.0),
|
|
Text(
|
|
L10n.of(context).joinWithCode,
|
|
style: TextStyle(
|
|
color: theme
|
|
.colorScheme.onPrimaryContainer,
|
|
fontSize: 16.0,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
onPressed: () =>
|
|
SpaceCodeUtil.joinWithSpaceCodeDialog(
|
|
context,
|
|
),
|
|
),
|
|
TextButton(
|
|
child: Row(
|
|
children: [
|
|
Icon(
|
|
Icons.add_box_outlined,
|
|
color: theme
|
|
.colorScheme.onPrimaryContainer,
|
|
size: 24.0,
|
|
),
|
|
const SizedBox(width: 8.0),
|
|
Text(
|
|
L10n.of(context).createYourSpace,
|
|
style: TextStyle(
|
|
color: theme
|
|
.colorScheme.onPrimaryContainer,
|
|
fontSize: 16.0,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
onPressed: () =>
|
|
context.push('/rooms/newspace'),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
);
|
|
},
|
|
),
|
|
controller.error != null
|
|
? Column(
|
|
spacing: 8.0,
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
ErrorIndicator(
|
|
message: L10n.of(context).oopsSomethingWentWrong,
|
|
),
|
|
IconButton(
|
|
onPressed: controller.setSpaceItems,
|
|
icon: const Icon(Icons.refresh),
|
|
),
|
|
],
|
|
)
|
|
: controller.loading
|
|
? const CircularProgressIndicator.adaptive()
|
|
: controller.spaceItems.isEmpty
|
|
? Text(
|
|
L10n.of(context).nothingFound,
|
|
)
|
|
: Expanded(
|
|
child: ListView.builder(
|
|
itemCount: controller.spaceItems.length,
|
|
itemBuilder: (context, index) {
|
|
final space =
|
|
controller.spaceItems[index];
|
|
return Padding(
|
|
padding: isColumnMode
|
|
? const EdgeInsets.only(
|
|
bottom: 32.0,
|
|
)
|
|
: const EdgeInsets.only(
|
|
bottom: 16.0,
|
|
),
|
|
child: PublicSpaceTile(space: space),
|
|
);
|
|
},
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|