Solar/App
2
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨ Stickers & packs

Browse Source
This commit is contained in:
LittleSheep
2025-05-11 22:05:54 +08:00
parent e4c6477bba
commit f6d651a98f
25 changed files with 3424 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

406
lib/screens/creators/stickers/pack_detail.dart Normal file
View File

@ -0,0 +1,406 @@
import 'package:auto_route/auto_route.dart';
import 'package:dio/dio.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:freezed_annotation/freezed_annotation.dart';
import 'package:gap/gap.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:island/models/sticker.dart';
import 'package:island/pods/network.dart';
import 'package:island/route.gr.dart';
import 'package:island/screens/creators/stickers/stickers.dart';
import 'package:island/widgets/alert.dart';
import 'package:island/widgets/app_scaffold.dart';
import 'package:island/widgets/content/cloud_file_picker.dart';
import 'package:island/widgets/content/cloud_files.dart';
import 'package:material_symbols_icons/symbols.dart';
import 'package:riverpod_annotation/riverpod_annotation.dart';
import 'package:styled_widget/styled_widget.dart';
import 'package:super_context_menu/super_context_menu.dart';
part 'pack_detail.g.dart';
part 'pack_detail.freezed.dart';
@riverpod
Future<List<SnSticker>> stickerPackContent(Ref ref, String packId) async {
final apiClient = ref.watch(apiClientProvider);
final resp = await apiClient.get('/stickers/$packId/content');
return resp.data
.map<SnSticker>((e) => SnSticker.fromJson(e))
.cast<SnSticker>()
.toList();
}
@RoutePage()
class StickerPackDetailScreen extends HookConsumerWidget {
final String id;
final String pubName;
const StickerPackDetailScreen({
super.key,
@PathParam('name') required this.pubName,
@PathParam('packId') required this.id,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
final pack = ref.watch(stickerPackProvider(id));
final packContent = ref.watch(stickerPackContentProvider(id));
Future<void> deleteSticker(SnSticker sticker) async {
final confirm = await showConfirmAlert(
'deleteStickerHint'.tr(),
'deleteSticker'.tr(),
);
if (!confirm) return;
if (!context.mounted) return;
try {
showLoadingModal(context);
final apiClient = ref.watch(apiClientProvider);
await apiClient.delete('/stickers/$id/content/${sticker.id}');
ref.invalidate(stickerPackContentProvider(id));
} catch (err) {
showErrorAlert(err);
} finally {
if (context.mounted) hideLoadingModal(context);
}
}
return AppScaffold(
appBar: AppBar(
title: Text(pack.value?.name ?? 'loading'.tr()),
actions: [
IconButton(
icon: const Icon(Symbols.add_circle),
onPressed: () {
AutoRouter.of(context).push(NewStickersRoute(packId: id)).then((
value,
) {
if (value != null) {
ref.invalidate(stickerPackContentProvider(id));
}
});
},
),
const Gap(8),
],
),
body: pack.when(
data:
(pack) => Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Text(pack!.description),
Row(
spacing: 4,
children: [
const Icon(Symbols.folder, size: 16),
Text(
'${packContent.value?.length ?? 0}/24',
style: GoogleFonts.robotoMono(),
),
],
).opacity(0.85),
Row(
spacing: 4,
children: [
const Icon(Symbols.sell, size: 16),
Text(pack.prefix, style: GoogleFonts.robotoMono()),
],
).opacity(0.85),
Row(
spacing: 4,
children: [
const Icon(Symbols.tag, size: 16),
SelectableText(
pack.id,
style: GoogleFonts.robotoMono(),
),
],
).opacity(0.85),
],
).padding(horizontal: 24, vertical: 24),
const Divider(height: 1),
Expanded(
child: packContent.when(
data:
(stickers) => RefreshIndicator(
onRefresh:
() => ref.refresh(
stickerPackContentProvider(id).future,
),
child: GridView.builder(
padding: const EdgeInsets.symmetric(
horizontal: 24,
vertical: 20,
),
gridDelegate:
const SliverGridDelegateWithMaxCrossAxisExtent(
maxCrossAxisExtent: 48,
mainAxisSpacing: 8,
crossAxisSpacing: 8,
),
itemCount: stickers.length,
itemBuilder: (context, index) {
final sticker = stickers[index];
return ContextMenuWidget(
menuProvider: (_) {
return Menu(
children: [
MenuAction(
title: 'edit'.tr(),
image: MenuImage.icon(Symbols.edit),
callback: () {
context.router
.push(
EditStickersRoute(
packId: id,
id: sticker.id,
),
)
.then((value) {
if (value != null) {
ref.invalidate(
stickerPackContentProvider(
id,
),
);
}
});
},
),
MenuAction(
title: 'delete'.tr(),
image: MenuImage.icon(Symbols.delete),
callback: () {
deleteSticker(sticker);
},
),
],
);
},
child: ClipRRect(
borderRadius: BorderRadius.all(
Radius.circular(8),
),
child: Container(
decoration: BoxDecoration(
color:
Theme.of(
context,
).colorScheme.surfaceContainer,
borderRadius: BorderRadius.all(
Radius.circular(8),
),
),
child: CloudImageWidget(
fileId: sticker.imageId,
),
),
),
);
},
),
),
error:
(err, _) =>
Text(
'Error: $err',
).textAlignment(TextAlign.center).center(),
loading: () => const CircularProgressIndicator().center(),
),
),
],
),
error:
(err, _) =>
Text('Error: $err').textAlignment(TextAlign.center).center(),
loading: () => const CircularProgressIndicator().center(),
),
);
}
}
@freezed
abstract class StickerWithPackQuery with _$StickerWithPackQuery {
const factory StickerWithPackQuery({
required String packId,
required String id,
}) = _StickerWithPackQuery;
}
@riverpod
Future<SnSticker?> stickerPackSticker(
Ref ref,
StickerWithPackQuery? query,
) async {
if (query == null) return null;
final apiClient = ref.watch(apiClientProvider);
final resp = await apiClient.get(
'/stickers/${query.packId}/content/${query.id}',
);
if (resp.data == null) return null;
return SnSticker.fromJson(resp.data);
}
@RoutePage()
class NewStickersScreen extends StatelessWidget {
final String packId;
const NewStickersScreen({
super.key,
@PathParam('packId') required this.packId,
});
@override
Widget build(BuildContext context) {
return EditStickersScreen(packId: packId, id: null);
}
}
@RoutePage()
class EditStickersScreen extends HookConsumerWidget {
final String packId;
final String? id;
const EditStickersScreen({
super.key,
@PathParam("packId") required this.packId,
@PathParam("id") required this.id,
});
@override
Widget build(BuildContext context, WidgetRef ref) {
final sticker = ref.watch(
stickerPackStickerProvider(
id == null ? null : StickerWithPackQuery(packId: packId, id: id!),
),
);
final formKey = useMemoized(() => GlobalKey<FormState>(), []);
final image = useState<String?>(id == null ? '' : sticker.value?.imageId);
final imageController = useTextEditingController(text: image.value);
final slugController = useTextEditingController(
text: id == null ? '' : sticker.value?.slug,
);
useEffect(() {
if (sticker.value != null) {
image.value = sticker.value!.imageId;
imageController.text = sticker.value!.imageId;
slugController.text = sticker.value!.slug;
}
return null;
}, [sticker]);
final submitting = useState(false);
Future<void> submit() async {
final apiClient = ref.watch(apiClientProvider);
submitting.value = true;
try {
final resp = await apiClient.request(
id == null
? '/stickers/$packId/content'
: '/stickers/$packId/content/$id',
data: {'slug': slugController.text, 'image_id': imageController.text},
options: Options(method: id == null ? 'POST' : 'PATCH'),
);
if (context.mounted) {
Navigator.pop(context, SnSticker.fromJson(resp.data));
}
} catch (err) {
showErrorAlert(err);
} finally {
submitting.value = false;
}
}
return AppScaffold(
appBar: AppBar(
title: Text(id == null ? 'createSticker' : 'editSticker').tr(),
),
body: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: 96,
width: 96,
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(8)),
child: Container(
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.surfaceContainer,
borderRadius: BorderRadius.all(Radius.circular(8)),
),
child:
(image.value?.isEmpty ?? true)
? const SizedBox.shrink()
: CloudImageWidget(fileId: image.value!),
),
),
),
const Gap(16),
Form(
key: formKey,
child: Column(
spacing: 8,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
TextFormField(
controller: imageController,
decoration: InputDecoration(
labelText: 'stickerImage'.tr(),
border: const UnderlineInputBorder(),
suffix: InkWell(
onTap: () {
showModalBottomSheet(
context: context,
builder: (context) => CloudFilePicker(),
).then((value) {
if (value == null) return;
image.value = value[0].id;
imageController.text = image.value!;
});
},
borderRadius: BorderRadius.all(Radius.circular(8)),
child: const Icon(
Symbols.cloud_upload,
).padding(horizontal: 4),
),
),
readOnly: true,
onTapOutside:
(_) => FocusManager.instance.primaryFocus?.unfocus(),
),
TextFormField(
controller: slugController,
decoration: InputDecoration(
labelText: 'stickerSlug'.tr(),
helperText: 'stickerSlugHint'.tr(),
border: const UnderlineInputBorder(),
),
onTapOutside:
(_) => FocusManager.instance.primaryFocus?.unfocus(),
),
],
),
),
const Gap(12),
Align(
alignment: Alignment.centerRight,
child: TextButton.icon(
onPressed: submitting.value ? null : submit,
icon: const Icon(Symbols.save),
label: Text(id == null ? 'create' : 'saveChanges').tr(),
),
),
],
).padding(horizontal: 24, vertical: 24),
);
}
}