fix: limit cover image upload to allowed 256kb size

KRTirtho · Sep 10, 2023 · 1c50612 · 1c50612
1 parent b9d5c70
commit 1c50612
Showing 1 changed file with 78 additions and 30 deletions.
diff --git a/lib/components/playlist/playlist_create_dialog.dart b/lib/components/playlist/playlist_create_dialog.dart
@@ -1,4 +1,5 @@
 import 'dart:convert';
+import 'dart:io';
 
 import 'package:collection/collection.dart';
 import 'package:flutter/material.dart';
@@ -154,39 +155,85 @@ class PlaylistCreateDialog extends HookConsumerWidget {
  child: ListView(
  shrinkWrap: true,
  children: [
- Center(
- child: Stack(
- children: [
- UniversalImage(
- path: image.value?.path ??
- TypeConversionUtils.image_X_UrlString(
- updatingPlaylist?.images,
- placeholder: ImagePlaceholder.collection,
+ FormField<XFile?>(
+ initialValue: image.value,
+ onSaved: (newValue) {
+ image.value = newValue;
+ },
+ validator: (value) {
+ if (value == null) return null;
+ final file = File(value.path);
+
+ if (file.lengthSync() > 256000) {
+ return "Image size should be less than 256kb";
+ }
+ return null;
+ },
+ builder: (field) {
+ return Center(
+ child: Stack(
+ children: [
+ UniversalImage(
+ path: field.value?.path ??
+ TypeConversionUtils.image_X_UrlString(
+ updatingPlaylist?.images,
+ placeholder:
+ ImagePlaceholder.collection,
+ ),
+ height: 200,
  ),
- height: 200,
- ),
- Positioned(
- bottom: 20,
- right: 20,
- child: IconButton.filled(
- icon: const Icon(SpotubeIcons.edit),
- style: IconButton.styleFrom(
- backgroundColor: theme.colorScheme.surface,
- foregroundColor: theme.colorScheme.primary,
- elevation: 2,
- shadowColor: theme.colorScheme.onSurface,
- ),
- onPressed: () async {
- final imageFile = await ImagePicker()
- .pickImage(source: ImageSource.gallery);
+ Positioned(
+ bottom: 20,
+ right: 20,
+ child: IconButton.filled(
+ icon: const Icon(SpotubeIcons.edit),
+ style: IconButton.styleFrom(
+ backgroundColor:
+ theme.colorScheme.surface,
+ foregroundColor:
+ theme.colorScheme.primary,
+ elevation: 2,
+ shadowColor: theme.colorScheme.onSurface,
+ ),
+ onPressed: () async {
+ final imageFile = await ImagePicker()
+ .pickImage(
+ source: ImageSource.gallery);
 
- image.value = imageFile ?? image.value;
- },
+ if (imageFile != null) {
+ field.didChange(imageFile);
+ field.validate();
+ field.save();
+ }
+ },
+ ),
+ ),
+ if (field.hasError)
+ Positioned(
+ bottom: 20,
+ left: 20,
+ child: Container(
+ padding: const EdgeInsets.symmetric(
+ horizontal: 8,
+ vertical: 4,
+ ),
+ decoration: BoxDecoration(
+ color: theme.colorScheme.error,
+ borderRadius: BorderRadius.circular(4),
+ ),
+ child: Text(
+ field.errorText ?? "",
+ style: theme.textTheme.bodyMedium!
+ .copyWith(
+ color: theme.colorScheme.onError,
+ ),
+ ),
+ ),
+ ),
+ ],
  ),
- ),
- ],
- ),
- ),
+ );
+ }),
  const SizedBox(height: 10),
  TextFormField(
  controller: playlistName,
@@ -203,6 +250,7 @@ class PlaylistCreateDialog extends HookConsumerWidget {
  hintText: context.l10n.description,
  ),
  keyboardType: TextInputType.multiline,
+ validator: ValidationBuilder().required().build(),
  maxLines: 5,
  ),
  const SizedBox(height: 10),