Created add link form

This commit is contained in:
Juan Gilsanz Polo
2024-02-23 15:45:06 +01:00
parent f1e5e3ec71
commit 6aa6acfbfd
13 changed files with 713 additions and 7 deletions

View File

@@ -0,0 +1,29 @@
import 'package:expandable/expandable.dart';
import 'package:flutter/material.dart';
import 'package:linkdy/constants/enums.dart';
import 'package:linkdy/models/data/check_bookmark.dart';
class AddLinkModel {
final TextEditingController urlController;
String? urlError;
CheckBookmark? checkBookmark;
LoadStatus? checkBookmarkLoadStatus;
final TextEditingController titleController;
final TextEditingController descriptionController;
bool markAsUnread;
final TextEditingController notesController;
final ExpandableController expandableController;
AddLinkModel({
required this.urlController,
this.urlError,
this.checkBookmark,
this.checkBookmarkLoadStatus,
required this.titleController,
required this.descriptionController,
this.markAsUnread = false,
required this.notesController,
required this.expandableController,
});
}

View File

@@ -0,0 +1,66 @@
import 'package:expandable/expandable.dart';
import 'package:flutter/material.dart';
import 'package:riverpod_annotation/riverpod_annotation.dart';
import 'package:linkdy/screens/links/model/add_link.model.dart';
import 'package:linkdy/constants/enums.dart';
import 'package:linkdy/constants/regexp.dart';
import 'package:linkdy/models/api_response.dart';
import 'package:linkdy/models/data/check_bookmark.dart';
import 'package:linkdy/providers/api_client_provider.dart';
part 'add_link.provider.g.dart';
@riverpod
Future<ApiResponse<CheckBookmark>> checkBookmark(CheckBookmarkRef ref, String url) async {
final result = await ref.watch(apiClientProviderProvider)!.fetchCheckAddBookmark(url: url);
return result;
}
@riverpod
class AddLink extends _$AddLink {
@override
AddLinkModel build() {
return AddLinkModel(
urlController: TextEditingController(),
titleController: TextEditingController(),
descriptionController: TextEditingController(),
notesController: TextEditingController(),
expandableController: ExpandableController(),
);
}
void validateUrl(String value) {
state.checkBookmark = null;
state.checkBookmarkLoadStatus = null;
if (Regexps.urlWithoutProtocol.hasMatch(value)) {
state.urlError = null;
ref.notifyListeners();
} else {
state.urlError = "Invalid URL";
ref.notifyListeners();
}
}
void checkUrlDetails() async {
if (state.urlError == null && state.urlController.text != "") {
state.checkBookmarkLoadStatus = LoadStatus.loading;
state.checkBookmark = null;
ref.notifyListeners();
final result = await ref.read(checkBookmarkProvider(state.urlController.text).future);
if (result.successful == true) {
state.checkBookmark = result.content;
state.checkBookmarkLoadStatus = LoadStatus.loaded;
} else {
state.checkBookmarkLoadStatus = LoadStatus.error;
}
ref.notifyListeners();
}
}
void updateMarkAsUnread(bool value) {
state.markAsUnread = value;
ref.notifyListeners();
}
}

View File

@@ -0,0 +1,179 @@
// GENERATED CODE - DO NOT MODIFY BY HAND
part of 'add_link.provider.dart';
// **************************************************************************
// RiverpodGenerator
// **************************************************************************
String _$checkBookmarkHash() => r'a4397a4497e3b7c8dec6027bb927371cc85e526c';
/// Copied from Dart SDK
class _SystemHash {
_SystemHash._();
static int combine(int hash, int value) {
// ignore: parameter_assignments
hash = 0x1fffffff & (hash + value);
// ignore: parameter_assignments
hash = 0x1fffffff & (hash + ((0x0007ffff & hash) << 10));
return hash ^ (hash >> 6);
}
static int finish(int hash) {
// ignore: parameter_assignments
hash = 0x1fffffff & (hash + ((0x03ffffff & hash) << 3));
// ignore: parameter_assignments
hash = hash ^ (hash >> 11);
return 0x1fffffff & (hash + ((0x00003fff & hash) << 15));
}
}
/// See also [checkBookmark].
@ProviderFor(checkBookmark)
const checkBookmarkProvider = CheckBookmarkFamily();
/// See also [checkBookmark].
class CheckBookmarkFamily
extends Family<AsyncValue<ApiResponse<CheckBookmark>>> {
/// See also [checkBookmark].
const CheckBookmarkFamily();
/// See also [checkBookmark].
CheckBookmarkProvider call(
String url,
) {
return CheckBookmarkProvider(
url,
);
}
@override
CheckBookmarkProvider getProviderOverride(
covariant CheckBookmarkProvider provider,
) {
return call(
provider.url,
);
}
static const Iterable<ProviderOrFamily>? _dependencies = null;
@override
Iterable<ProviderOrFamily>? get dependencies => _dependencies;
static const Iterable<ProviderOrFamily>? _allTransitiveDependencies = null;
@override
Iterable<ProviderOrFamily>? get allTransitiveDependencies =>
_allTransitiveDependencies;
@override
String? get name => r'checkBookmarkProvider';
}
/// See also [checkBookmark].
class CheckBookmarkProvider
extends AutoDisposeFutureProvider<ApiResponse<CheckBookmark>> {
/// See also [checkBookmark].
CheckBookmarkProvider(
String url,
) : this._internal(
(ref) => checkBookmark(
ref as CheckBookmarkRef,
url,
),
from: checkBookmarkProvider,
name: r'checkBookmarkProvider',
debugGetCreateSourceHash:
const bool.fromEnvironment('dart.vm.product')
? null
: _$checkBookmarkHash,
dependencies: CheckBookmarkFamily._dependencies,
allTransitiveDependencies:
CheckBookmarkFamily._allTransitiveDependencies,
url: url,
);
CheckBookmarkProvider._internal(
super._createNotifier, {
required super.name,
required super.dependencies,
required super.allTransitiveDependencies,
required super.debugGetCreateSourceHash,
required super.from,
required this.url,
}) : super.internal();
final String url;
@override
Override overrideWith(
FutureOr<ApiResponse<CheckBookmark>> Function(CheckBookmarkRef provider)
create,
) {
return ProviderOverride(
origin: this,
override: CheckBookmarkProvider._internal(
(ref) => create(ref as CheckBookmarkRef),
from: from,
name: null,
dependencies: null,
allTransitiveDependencies: null,
debugGetCreateSourceHash: null,
url: url,
),
);
}
@override
AutoDisposeFutureProviderElement<ApiResponse<CheckBookmark>> createElement() {
return _CheckBookmarkProviderElement(this);
}
@override
bool operator ==(Object other) {
return other is CheckBookmarkProvider && other.url == url;
}
@override
int get hashCode {
var hash = _SystemHash.combine(0, runtimeType.hashCode);
hash = _SystemHash.combine(hash, url.hashCode);
return _SystemHash.finish(hash);
}
}
mixin CheckBookmarkRef
on AutoDisposeFutureProviderRef<ApiResponse<CheckBookmark>> {
/// The parameter `url` of this provider.
String get url;
}
class _CheckBookmarkProviderElement
extends AutoDisposeFutureProviderElement<ApiResponse<CheckBookmark>>
with CheckBookmarkRef {
_CheckBookmarkProviderElement(super.provider);
@override
String get url => (origin as CheckBookmarkProvider).url;
}
String _$addLinkHash() => r'd971275978e113b16d1bc34a2370d9d3feba60b5';
/// See also [AddLink].
@ProviderFor(AddLink)
final addLinkProvider =
AutoDisposeNotifierProvider<AddLink, AddLinkModel>.internal(
AddLink.new,
name: r'addLinkProvider',
debugGetCreateSourceHash:
const bool.fromEnvironment('dart.vm.product') ? null : _$addLinkHash,
dependencies: null,
allTransitiveDependencies: null,
);
typedef _$AddLink = AutoDisposeNotifier<AddLinkModel>;
// ignore_for_file: type=lint
// ignore_for_file: subtype_of_sealed_class, invalid_use_of_internal_member, invalid_use_of_visible_for_testing_member

View File

@@ -0,0 +1,261 @@
import 'package:expandable/expandable.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:linkdy/screens/links/provider/add_link.provider.dart';
import 'package:linkdy/constants/enums.dart';
import 'package:linkdy/i18n/strings.g.dart';
class AddLinkModal extends ConsumerStatefulWidget {
const AddLinkModal({Key? key}) : super(key: key);
@override
AddLinkModalState createState() => AddLinkModalState();
}
class AddLinkModalState extends ConsumerState<AddLinkModal> with SingleTickerProviderStateMixin {
late AnimationController _animationController;
late Animation<double> _animation;
@override
void initState() {
_animationController = AnimationController(
duration: const Duration(milliseconds: 200),
vsync: this,
);
_animation = Tween(
begin: 0.0,
end: 0.5,
).animate(
CurvedAnimation(
parent: _animationController,
curve: Curves.easeInOut,
),
);
super.initState();
}
@override
Widget build(BuildContext context) {
final provider = ref.watch(addLinkProvider);
return Padding(
padding: MediaQuery.of(context).viewInsets,
child: Container(
decoration: BoxDecoration(
borderRadius: const BorderRadius.only(topLeft: Radius.circular(28), topRight: Radius.circular(28)),
color: Theme.of(context).dialogBackgroundColor,
),
child: SafeArea(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Flexible(
child: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const SizedBox(height: 24),
Icon(
Icons.add_rounded,
color: Theme.of(context).colorScheme.secondary,
size: 24,
),
const SizedBox(height: 16),
Text(
t.links.addLink.addLink,
textAlign: TextAlign.center,
style: const TextStyle(fontSize: 24),
),
const SizedBox(height: 24),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: TextFormField(
controller: provider.urlController,
onChanged: ref.read(addLinkProvider.notifier).validateUrl,
enabled: provider.checkBookmarkLoadStatus != LoadStatus.loading,
decoration: InputDecoration(
prefixIcon: const Icon(Icons.link_rounded),
border: const OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
errorText: provider.urlError,
labelText: t.links.addLink.url,
),
),
),
if (provider.checkBookmarkLoadStatus == LoadStatus.loading)
Padding(
padding: const EdgeInsets.only(top: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const SizedBox(
height: 12,
width: 12,
child: CircularProgressIndicator(
strokeWidth: 2,
),
),
const SizedBox(width: 8),
Text(t.links.addLink.checkingUrl),
],
),
),
if (provider.checkBookmark != null) ...[
const SizedBox(height: 24),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: TextFormField(
controller: provider.titleController,
// onChanged: ref.read(addLinkProvider.notifier).validateUrl,
// enabled: provider.checkBookmarkLoadStatus != LoadStatus.loading,
decoration: InputDecoration(
prefixIcon: const Icon(Icons.title_rounded),
border: const OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
errorText: provider.urlError,
labelText: t.links.addLink.title,
hintText: provider.checkBookmark?.metadata?.title,
floatingLabelBehavior: FloatingLabelBehavior.always,
),
),
),
const SizedBox(height: 24),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: TextFormField(
controller: provider.descriptionController,
// onChanged: ref.read(addLinkProvider.notifier).validateUrl,
// enabled: provider.checkBookmarkLoadStatus != LoadStatus.loading,
decoration: InputDecoration(
prefixIcon: const Icon(Icons.description_rounded),
border: const OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
errorText: provider.urlError,
labelText: t.links.addLink.description,
hintText: provider.checkBookmark?.metadata?.description,
floatingLabelBehavior: FloatingLabelBehavior.always,
),
),
),
const SizedBox(height: 16),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24),
child: ExpandablePanel(
controller: provider.expandableController,
collapsed: ListTile(
onTap: () {
_animationController.animateTo(provider.expandableController.expanded == true ? 0 : 1);
provider.expandableController.toggle();
},
title: Text(t.links.addLink.addNotes),
trailing: RotationTransition(
turns: _animation,
child: Icon(
Icons.expand_more_rounded,
size: 26,
color: Theme.of(context).colorScheme.secondary,
),
),
contentPadding: const EdgeInsets.all(0),
),
expanded: Column(
children: [
ListTile(
onTap: () {
_animationController.animateTo(
provider.expandableController.expanded == true ? 0 : 1,
);
provider.expandableController.toggle();
},
title: Text(t.links.addLink.addNotes),
trailing: RotationTransition(
turns: _animation,
child: Icon(
Icons.expand_more_rounded,
size: 26,
color: Theme.of(context).colorScheme.secondary,
),
),
contentPadding: const EdgeInsets.all(0),
),
const SizedBox(height: 8),
SizedBox(
height: 130,
child: TextFormField(
controller: provider.notesController,
decoration: InputDecoration(
prefixIcon: const Icon(Icons.note_rounded),
border: const OutlineInputBorder(
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
labelText: t.links.addLink.notes,
),
autocorrect: false,
expands: true,
minLines: null,
maxLines: null,
textAlignVertical: TextAlignVertical.top,
),
),
const SizedBox(height: 16),
],
),
),
),
SwitchListTile(
contentPadding: const EdgeInsets.symmetric(horizontal: 24, vertical: 0),
title: Text(t.links.addLink.markAsUnread),
value: provider.markAsUnread,
onChanged: ref.read(addLinkProvider.notifier).updateMarkAsUnread,
),
],
],
),
),
),
Padding(
padding: const EdgeInsets.all(24),
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
TextButton(
onPressed: () => Navigator.pop(context),
child: Text(t.generic.cancel),
),
const SizedBox(width: 8),
if (provider.checkBookmark == null)
TextButton(
onPressed: provider.checkBookmarkLoadStatus != LoadStatus.loading
? ref.read(addLinkProvider.notifier).checkUrlDetails
: null,
child: Text(t.generic.next),
),
if (provider.checkBookmark != null)
TextButton(
onPressed: () => Navigator.pop(context),
child: Text(t.generic.confirm),
),
],
),
),
],
),
),
),
);
}
}

View File

@@ -3,6 +3,8 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:linkdy/screens/links/provider/links.provider.dart';
import 'package:linkdy/screens/links/ui/add_link_modal.dart';
import 'package:linkdy/providers/router_provider.dart';
import 'package:linkdy/router/paths.dart';
import 'package:linkdy/i18n/strings.g.dart';
@@ -37,9 +39,18 @@ class Links extends ConsumerWidget {
}
}
return Material(
color: Colors.transparent,
child: NestedScrollView(
void openAddModal() {
showModalBottomSheet(
useRootNavigator: true,
context: context,
isScrollControlled: true,
useSafeArea: true,
builder: (context) => const AddLinkModal(),
);
}
return Scaffold(
body: NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) => [
SliverOverlapAbsorber(
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
@@ -168,6 +179,10 @@ class Links extends ConsumerWidget {
),
),
),
floatingActionButton: FloatingActionButton(
onPressed: openAddModal,
child: const Icon(Icons.add_rounded),
),
);
}
}