addon store initial
This commit is contained in:
Fabian Freund
@@ -0,0 +1,218 @@
|
||||
/*
|
||||
* Copyright (c) 2024-2026 Fabian Freund.
|
||||
*
|
||||
* This file is part of WebLibre
|
||||
* (see https://weblibre.eu).
|
||||
*
|
||||
* This program is free software: you can redistribute it and/or modify
|
||||
* it under the terms of the GNU Affero General Public License as
|
||||
* published by the Free Software Foundation, either version 3 of the
|
||||
* License, or (at your option) any later version.
|
||||
*
|
||||
* This program is distributed in the hope that it will be useful,
|
||||
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
* GNU Affero General Public License for more details.
|
||||
*
|
||||
* You should have received a copy of the GNU Affero General Public License
|
||||
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
*/
|
||||
import 'dart:async';
|
||||
|
||||
import 'package:fading_scroll/fading_scroll.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_hooks/flutter_hooks.dart';
|
||||
import 'package:flutter_mozilla_components/flutter_mozilla_components.dart';
|
||||
import 'package:hooks_riverpod/hooks_riverpod.dart';
|
||||
import 'package:weblibre/core/routing/routes.dart';
|
||||
import 'package:weblibre/features/addons/domain/providers.dart';
|
||||
import 'package:weblibre/features/addons/presentation/widgets/addon_listing_card.dart';
|
||||
|
||||
class AddonBrowseView extends HookConsumerWidget {
|
||||
const AddonBrowseView({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final app = ref.watch(addonStoreAppFilterProvider);
|
||||
|
||||
final searchController = useTextEditingController();
|
||||
final query = useState<String>('');
|
||||
final debounceTimer = useRef<Timer?>(null);
|
||||
|
||||
useEffect(
|
||||
() =>
|
||||
() => debounceTimer.value?.cancel(),
|
||||
const [],
|
||||
);
|
||||
|
||||
final listingsAsync = ref.watch(
|
||||
searchAddonListingsProvider(query.value, app),
|
||||
);
|
||||
|
||||
final installed = ref.watch(
|
||||
addonListProvider.select(
|
||||
(value) =>
|
||||
value.value?.where((a) => a.isInstalled).map((a) => a.id).toSet() ??
|
||||
const <String>{},
|
||||
),
|
||||
);
|
||||
|
||||
return Column(
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 8, 16, 0),
|
||||
child: SizedBox(
|
||||
width: double.infinity,
|
||||
child: SegmentedButton<AddonStoreApp>(
|
||||
segments: const [
|
||||
ButtonSegment(
|
||||
value: AddonStoreApp.android,
|
||||
icon: Icon(Icons.phone_android),
|
||||
label: Text('Android'),
|
||||
),
|
||||
ButtonSegment(
|
||||
value: AddonStoreApp.firefox,
|
||||
icon: Icon(Icons.desktop_windows),
|
||||
label: Text('Desktop'),
|
||||
),
|
||||
],
|
||||
selected: {app},
|
||||
onSelectionChanged: (selection) => ref
|
||||
.read(addonStoreAppFilterProvider.notifier)
|
||||
.setApp(selection.first),
|
||||
),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: TextField(
|
||||
controller: searchController,
|
||||
decoration: InputDecoration(
|
||||
hintText: 'Search addons.mozilla.org',
|
||||
prefixIcon: const Icon(Icons.search),
|
||||
suffixIcon: query.value.isEmpty
|
||||
? null
|
||||
: IconButton(
|
||||
icon: const Icon(Icons.clear),
|
||||
onPressed: () {
|
||||
searchController.clear();
|
||||
query.value = '';
|
||||
},
|
||||
),
|
||||
border: const OutlineInputBorder(),
|
||||
isDense: true,
|
||||
),
|
||||
onChanged: (text) {
|
||||
debounceTimer.value?.cancel();
|
||||
debounceTimer.value = Timer(
|
||||
const Duration(milliseconds: 400),
|
||||
() => query.value = text,
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
if (app == AddonStoreApp.firefox)
|
||||
const Padding(
|
||||
padding: EdgeInsets.fromLTRB(16, 0, 16, 12),
|
||||
child: _DesktopCompatibilityWarning(),
|
||||
),
|
||||
Expanded(
|
||||
child: listingsAsync.when(
|
||||
skipLoadingOnReload: true,
|
||||
data: (listings) =>
|
||||
_ListingList(listings: listings, installedIds: installed),
|
||||
loading: () => const Center(child: CircularProgressIndicator()),
|
||||
error: (error, _) => Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(Icons.error_outline, size: 40),
|
||||
const SizedBox(height: 12),
|
||||
const Text('Failed to load extensions'),
|
||||
const SizedBox(height: 8),
|
||||
Text(error.toString(), textAlign: TextAlign.center),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _DesktopCompatibilityWarning extends StatelessWidget {
|
||||
const _DesktopCompatibilityWarning();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: theme.colorScheme.tertiaryContainer.withValues(alpha: 0.5),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
border: Border.all(color: theme.colorScheme.tertiary),
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Icon(Icons.info_outline, color: theme.colorScheme.tertiary, size: 20),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Desktop extensions are not reviewed for mobile. Some may not '
|
||||
'work, may crash, or may behave unexpectedly on Android.',
|
||||
style: TextStyle(
|
||||
color: theme.colorScheme.onTertiaryContainer,
|
||||
fontSize: 12,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ListingList extends StatelessWidget {
|
||||
final List<AddonListing> listings;
|
||||
final Set<String> installedIds;
|
||||
|
||||
const _ListingList({required this.listings, required this.installedIds});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (listings.isEmpty) {
|
||||
return const Center(child: Text('No extensions found.'));
|
||||
}
|
||||
|
||||
return FadingScroll(
|
||||
fadingSize: 25,
|
||||
builder: (context, controller) {
|
||||
return ListView.builder(
|
||||
controller: controller,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
itemCount: listings.length,
|
||||
itemBuilder: (context, index) {
|
||||
final listing = listings[index];
|
||||
return AddonListingCard(
|
||||
listing: listing,
|
||||
isInstalled: installedIds.contains(listing.id),
|
||||
onTap: () async {
|
||||
await AddonListingDetailsRoute(
|
||||
addonId: listing.id,
|
||||
$extra: listing,
|
||||
).push<void>(context);
|
||||
},
|
||||
);
|
||||
},
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user