feat!(form): migrate to wyatt architecture

This commit is contained in:
2022-11-09 22:35:41 -05:00
parent 79fdd3c837
commit b89ef3de8a
62 changed files with 1387 additions and 818 deletions
@@ -21,6 +21,6 @@
<key>CFBundleVersion</key>
<string>1.0</string>
<key>MinimumOSVersion</key>
<string>9.0</string>
<string>11.0</string>
</dict>
</plist>
@@ -272,7 +272,7 @@
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 9.0;
IPHONEOS_DEPLOYMENT_TARGET = 11.0;
MTL_ENABLE_DEBUG_INFO = NO;
SDKROOT = iphoneos;
SUPPORTED_PLATFORMS = iphoneos;
@@ -349,7 +349,7 @@
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 9.0;
IPHONEOS_DEPLOYMENT_TARGET = 11.0;
MTL_ENABLE_DEBUG_INFO = YES;
ONLY_ACTIVE_ARCH = YES;
SDKROOT = iphoneos;
@@ -398,7 +398,7 @@
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 9.0;
IPHONEOS_DEPLOYMENT_TARGET = 11.0;
MTL_ENABLE_DEBUG_INFO = NO;
SDKROOT = iphoneos;
SUPPORTED_PLATFORMS = iphoneos;
@@ -43,5 +43,7 @@
</array>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
<key>CADisableMinimumFrameDurationOnPhone</key>
<true/>
</dict>
</plist>
@@ -18,7 +18,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:form_bloc_example/app/metadata.dart';
import 'package:form_bloc_example/constants.dart';
import 'package:form_bloc_example/cubit/custom_form_cubit.dart';
import 'package:form_bloc_example/simple_custom_form_cubit/simple_custom_form_cubit.dart';
import 'package:form_bloc_example/sign_up/sign_up_page.dart';
import 'package:wyatt_form_bloc/wyatt_form_bloc.dart';
@@ -29,41 +29,43 @@ class App extends StatelessWidget {
const App({Key? key}) : super(key: key);
static List<FormInput> getNormalEntries() {
return const [
FormInput(formFieldName, Name.pure(), metadata: FormInputMetadata<Metadata>(extra: blue)),
FormInput(formFieldEmail, Email.pure(), metadata: FormInputMetadata<Metadata>(extra: blue)),
FormInput(formFieldPhone, Phone.pure(), metadata: FormInputMetadata<Metadata>(extra: red)),
FormInput(
formFieldList, ListOption<String>.pure(defaultValue: ['checkbox3'])),
FormInput(formFieldRadio, TextString.pure()),
FormInput(formFieldPro, Boolean.pure(),
metadata: FormInputMetadata<Metadata>(name: 'business')),
FormInput(formFieldHidden, Boolean.pure(),
metadata: FormInputMetadata<Metadata>(export: false, extra: blue)),
return [
FormInput(formFieldName, const Name.pure(),
metadata: const FormInputMetadata<Metadata>(extra: blue)),
FormInput(formFieldEmail, const Email.pure(),
metadata: const FormInputMetadata<Metadata>(extra: blue)),
FormInput(formFieldList,
const ListOption<String>.pure(defaultValue: 'c3')),
FormInput(formFieldRadio, const TextString.pure()),
FormInput(formFieldPro, const Boolean.pure(),
metadata: const FormInputMetadata<Metadata>(name: 'business')),
FormInput(formFieldHidden, const Boolean.pure(),
metadata:
const FormInputMetadata<Metadata>(export: false, extra: blue)),
];
}
static List<FormInput> getBusinessEntries() {
const entries = [
FormInput(formFieldSiren, Siren.pure()),
FormInput(formFieldIban, Iban.pure()),
final entries = [
FormInput(formFieldPhone, const Phone.pure(),
metadata: const FormInputMetadata<Metadata>(extra: red)),
];
return getNormalEntries() + entries;
}
static FormData getNormalFormData() {
return FormData(getNormalEntries());
static WyattForm getNormalFormData() {
return WyattFormImpl(getNormalEntries());
}
static FormData getProFormData() {
return FormData(getBusinessEntries());
static WyattForm getProFormData() {
return WyattFormImpl(getBusinessEntries());
}
@override
Widget build(BuildContext context) {
FormDataCubit formCubit = CustomFormCubit(inputs: getNormalFormData());
SimpleCustomFormCubit formCubit = SimpleCustomFormCubit(getNormalFormData());
return BlocProvider(
return BlocProvider<SimpleCustomFormCubit>(
create: (context) => formCubit,
child: const WidgetTree(),
);
@@ -28,7 +28,5 @@ class Metadata {
});
@override
String toString() {
return category.toString();
}
String toString() => 'Metadata(category: $category)';
}
@@ -17,8 +17,6 @@
const String formFieldName = 'name';
const String formFieldPhone = 'phone';
const String formFieldEmail = 'email';
const String formFieldSiren = 'siren';
const String formFieldIban = 'iban';
const String formFieldList = 'list';
const String formFieldRadio = 'radio';
const String formFieldHidden = 'hidden';
@@ -14,39 +14,33 @@
// You should have received a copy of the GNU General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
import 'dart:developer';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:form_bloc_example/app/app.dart';
import 'package:form_bloc_example/app/metadata.dart';
import 'package:form_bloc_example/constants.dart';
import 'package:form_bloc_example/simple_custom_form_cubit/simple_custom_form_cubit.dart';
import 'package:wyatt_form_bloc/wyatt_form_bloc.dart';
class CategoryIndicator extends StatelessWidget {
const CategoryIndicator(
{Key? key, required this.field, required this.builder})
: super(key: key);
final String field;
final Function(BuildContext context, FormDataState state) builder;
Color computeColor(Metadata meta) {
switch (meta.category) {
case Category.perso:
return Colors.blue;
case Category.business:
return Colors.red;
}
Color computeColor(Metadata? meta) {
switch (meta?.category) {
case Category.perso:
return Colors.blue;
case Category.business:
return Colors.red;
case null:
return Colors.green;
}
}
class _NameInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocBuilder<FormDataCubit, FormDataState>(
builder: ((context, state) {
final meta = state.data.metadataOf(field).extra as Metadata;
return InputBuilderMetadata<SimpleCustomFormCubit, Metadata>(
field: formFieldName,
builder: (context, cubit, state, field, inputValid, metadata) {
final meta = state.form.metadataOf<Metadata>(field).extra;
final color = computeColor(meta);
return Row(
children: [
Container(
@@ -57,58 +51,24 @@ class CategoryIndicator extends StatelessWidget {
borderRadius: BorderRadius.circular(8),
),
),
const SizedBox(width: 20,),
const SizedBox(
width: 20,
),
SizedBox(
width: MediaQuery.of(context).size.width - 45,
child: builder(context, state),
child: TextField(
onChanged: (value) =>
cubit.dataChanged(field, Name.dirty(value)),
keyboardType: TextInputType.name,
decoration: InputDecoration(
labelText: 'name',
helperText: '',
errorText: !inputValid ? 'invalid name' : null,
),
),
)
],
);
}),
);
}
}
class _NameInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CategoryIndicator(
field: formFieldName,
builder: (context, state) {
return TextField(
onChanged: (name) => context
.read<FormDataCubit>()
.dataChanged(formFieldName, Name.dirty(name)),
keyboardType: TextInputType.name,
decoration: InputDecoration(
labelText: 'name',
helperText: '',
errorText:
state.data.isNotValid(formFieldName) ? 'invalid name' : null,
),
);
});
}
}
class _EmailInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CategoryIndicator(
field: formFieldEmail,
builder: (context, state) {
return TextField(
onChanged: (email) => context
.read<FormDataCubit>()
.dataChanged(formFieldEmail, Email.dirty(email)),
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
labelText: 'email',
helperText: '',
errorText:
state.data.isNotValid(formFieldEmail) ? 'invalid email' : null,
),
);
},
);
}
@@ -117,67 +77,58 @@ class _EmailInput extends StatelessWidget {
class _PhoneInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CategoryIndicator(
field: formFieldPhone,
builder: (context, state) {
return TextField(
onChanged: (phone) => context
.read<FormDataCubit>()
.dataChanged(formFieldPhone, Phone.dirty(phone)),
keyboardType: TextInputType.phone,
decoration: InputDecoration(
labelText: 'phone',
helperText: '',
errorText:
state.data.isNotValid(formFieldPhone) ? 'invalid phone' : null,
),
return InputBuilderMetadata<SimpleCustomFormCubit, Metadata>(
field: formFieldPhone,
builder: (context, cubit, state, field, inputValid, metadata) {
final meta = state.form.metadataOf<Metadata>(field).extra;
final color = computeColor(meta);
return Row(
children: [
Container(
height: 8,
width: 8,
decoration: BoxDecoration(
color: color,
borderRadius: BorderRadius.circular(8),
),
),
const SizedBox(
width: 20,
),
SizedBox(
width: MediaQuery.of(context).size.width - 45,
child: TextField(
onChanged: (value) =>
cubit.dataChanged(field, Phone.dirty(value)),
keyboardType: TextInputType.phone,
decoration: InputDecoration(
labelText: 'phone',
helperText: '',
errorText: !inputValid ? 'invalid phone' : null,
),
),
)
],
);
},
);
}
}
class _SirenInput extends StatelessWidget {
class _EmailInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return CategoryIndicator(
field: formFieldName,
builder: (context, state) {
return TextField(
onChanged: (siren) => context
.read<FormDataCubit>()
.dataChanged(formFieldSiren, Siren.dirty(siren)),
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'siren',
helperText: '',
errorText:
state.data.isNotValid(formFieldSiren) ? 'invalid SIREN' : null,
),
);
},
);
}
}
class _IbanInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocBuilder<FormDataCubit, FormDataState>(
builder: (context, state) {
return TextField(
onChanged: (iban) => context
.read<FormDataCubit>()
.dataChanged(formFieldIban, Iban.dirty(iban)),
keyboardType: TextInputType.text,
decoration: InputDecoration(
labelText: 'iban',
helperText: '',
errorText:
state.data.isNotValid(formFieldIban) ? 'invalid IBAN' : null,
),
);
},
return InputBuilder<SimpleCustomFormCubit>(
field: formFieldEmail,
builder: (context, cubit, state, field, inputValid) => TextField(
onChanged: (value) => cubit.dataChanged(field, Email.dirty(value)),
keyboardType: TextInputType.emailAddress,
decoration: InputDecoration(
labelText: 'email',
helperText: '',
errorText: !inputValid ? 'invalid email' : null,
),
),
);
}
}
@@ -185,11 +136,11 @@ class _IbanInput extends StatelessWidget {
class _CheckListInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocBuilder<FormDataCubit, FormDataState>(
builder: (context, state) {
final input =
state.data.validatorOf<ListOption<String>>(formFieldList);
final options = input.value;
return InputBuilder<SimpleCustomFormCubit>(
field: formFieldList,
builder: (context, cubit, state, field, inputValid) {
final input = state.form.validatorOf<ListOption<String>>(field);
final choices = ['c1', 'c2', 'c3'];
return Column(
mainAxisSize: MainAxisSize.min,
@@ -197,34 +148,34 @@ class _CheckListInput extends StatelessWidget {
ListTile(
title: const Text('Checkbox1'),
trailing: Checkbox(
value: options.contains('checkbox1'),
value: input.value == choices[0],
onChanged: (_) {
context.read<FormDataCubit>().dataChanged(
formFieldList,
input.select('checkbox1'),
);
cubit.dataChanged(
field,
ListOption.dirty(choices: choices, value: choices[0]),
);
}),
),
ListTile(
title: const Text('Checkbox2'),
trailing: Checkbox(
value: options.contains('checkbox2'),
value: input.value == choices[1],
onChanged: (_) {
context.read<FormDataCubit>().dataChanged(
formFieldList,
input.select('checkbox2'),
);
cubit.dataChanged(
field,
ListOption.dirty(choices: choices, value: choices[1]),
);
}),
),
ListTile(
title: const Text('Checkbox3 (default)'),
trailing: Checkbox(
value: options.contains('checkbox3'),
value: input.value == choices[2],
onChanged: (_) {
context.read<FormDataCubit>().dataChanged(
formFieldList,
input.select('checkbox3'),
);
cubit.dataChanged(
field,
ListOption.dirty(choices: choices, value: choices[2]),
);
}),
),
],
@@ -237,9 +188,10 @@ class _CheckListInput extends StatelessWidget {
class _RadioListInput extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocBuilder<FormDataCubit, FormDataState>(
builder: (context, state) {
final input = state.data.validatorOf<TextString>(formFieldRadio);
return InputBuilder<SimpleCustomFormCubit>(
field: formFieldRadio,
builder: ((context, cubit, state, field, inputValid) {
final input = state.form.validatorOf<TextString>(field);
return Column(
mainAxisSize: MainAxisSize.min,
@@ -250,10 +202,10 @@ class _RadioListInput extends StatelessWidget {
groupValue: true,
value: input.value == 'radio1',
onChanged: (_) {
context.read<FormDataCubit>().dataChanged(
formFieldRadio,
const TextString.dirty('radio1'),
);
cubit.dataChanged(
field,
const TextString.dirty('radio1'),
);
}),
),
ListTile(
@@ -262,10 +214,10 @@ class _RadioListInput extends StatelessWidget {
groupValue: true,
value: input.value == 'radio2',
onChanged: (_) {
context.read<FormDataCubit>().dataChanged(
formFieldRadio,
const TextString.dirty('radio2'),
);
cubit.dataChanged(
field,
const TextString.dirty('radio2'),
);
}),
),
ListTile(
@@ -274,15 +226,15 @@ class _RadioListInput extends StatelessWidget {
groupValue: true,
value: input.value == 'radio3',
onChanged: (_) {
context.read<FormDataCubit>().dataChanged(
formFieldRadio,
const TextString.dirty('radio3'),
);
cubit.dataChanged(
field,
const TextString.dirty('radio3'),
);
}),
),
],
);
},
}),
);
}
}
@@ -292,17 +244,18 @@ class _CheckHiddenInput extends StatelessWidget {
Widget build(BuildContext context) {
return ListTile(
title: const Text('This input is not exported'),
trailing: BlocBuilder<FormDataCubit, FormDataState>(
builder: (context, state) {
trailing: InputBuilder<SimpleCustomFormCubit>(
field: formFieldHidden,
builder: (context, cubit, state, field, inputValid) {
return Checkbox(
value: state.data.validatorOf<Boolean>(formFieldHidden).value,
value: state.form.validatorOf<Boolean>(field).value,
onChanged: (v) {
final value = v!; // state is false, so value can't be null
context.read<FormDataCubit>().dataChanged(
formFieldHidden,
Boolean.dirty(value: value),
);
cubit.dataChanged(
field,
Boolean.dirty(value: value),
);
});
},
),
@@ -315,25 +268,24 @@ class _CheckIsProInput extends StatelessWidget {
Widget build(BuildContext context) {
return ListTile(
title: const Text('Are you a pro?'),
trailing: BlocBuilder<FormDataCubit, FormDataState>(
builder: (context, state) {
trailing: InputBuilder<SimpleCustomFormCubit>(
field: formFieldPro,
builder: (context, cubit, state, field, inputValid) {
return Checkbox(
value: state.data.validatorOf<Boolean>(formFieldPro).value,
onChanged: (isPro) {
final value = isPro!; // state is false, so value can't be null
value: state.form.validatorOf<Boolean>(field).value,
onChanged: (v) {
final value = v!; // state is false, so value can't be null
context.read<FormDataCubit>().dataChanged(
formFieldPro,
Boolean.dirty(value: value),
);
cubit.dataChanged(
field,
Boolean.dirty(value: value),
);
if (value) {
context.read<FormDataCubit>().updateFormData(
App.getProFormData(),
cubit.update(App.getProFormData(),
operation: SetOperation.union);
} else {
context.read<FormDataCubit>().updateFormData(
App.getNormalFormData(),
cubit.update(App.getNormalFormData(),
operation: SetOperation.intersection);
}
});
@@ -346,49 +298,28 @@ class _CheckIsProInput extends StatelessWidget {
class _SignUpButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocBuilder<FormDataCubit, FormDataState>(
buildWhen: (previous, current) => previous.status != current.status,
builder: (context, state) {
return state.status.isSubmissionInProgress
? const CircularProgressIndicator()
: ElevatedButton(
onPressed: state.status.isValidated
? () => context.read<FormDataCubit>().submitForm()
: null,
child: const Text('SIGN UP'),
);
},
);
}
}
class _DebugButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocBuilder<FormDataCubit, FormDataState>(
builder: (context, state) {
return ElevatedButton(
onPressed: () {
log(state.toString());
},
child: const Text('DEBUG'),
);
},
);
return SubmitBuilder<SimpleCustomFormCubit>(
builder: (context, cubit, status) {
return status.isSubmissionInProgress
? const CircularProgressIndicator()
: ElevatedButton(
onPressed: status.isValidated ? () => cubit.submit() : null,
child: const Text('SIGN UP'),
);
});
}
}
class _ResetButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocBuilder<FormDataCubit, FormDataState>(
builder: (context, state) {
return ElevatedButton(
onPressed: () => context.read<FormDataCubit>().resetForm(),
child: const Text('RESET'),
);
},
);
return SubmitBuilder<SimpleCustomFormCubit>(
builder: (context, cubit, status) {
return ElevatedButton(
onPressed: () => cubit.reset(),
child: const Text('RESET'),
);
});
}
}
@@ -397,7 +328,7 @@ class SignUpForm extends StatelessWidget {
@override
Widget build(BuildContext context) {
return BlocListener<FormDataCubit, FormDataState>(
return BlocListener<SimpleCustomFormCubit, FormDataState>(
listener: (context, state) {
if (state.status.isSubmissionSuccess) {
Navigator.of(context).pop(); // Never happens here
@@ -418,8 +349,6 @@ class SignUpForm extends StatelessWidget {
const SizedBox(height: 8),
_EmailInput(),
const SizedBox(height: 8),
_PhoneInput(),
const SizedBox(height: 8),
_CheckListInput(),
const SizedBox(height: 8),
_RadioListInput(),
@@ -428,13 +357,12 @@ class SignUpForm extends StatelessWidget {
const SizedBox(height: 8),
_CheckIsProInput(),
const SizedBox(height: 8),
BlocBuilder<FormDataCubit, FormDataState>(
BlocBuilder<SimpleCustomFormCubit, FormDataState>(
builder: (context, state) {
if (state.data.validatorOf<Boolean>(formFieldPro).value) {
if (state.form.validatorOf<Boolean>(formFieldPro).value ??
false) {
return Column(children: [
_SirenInput(),
const SizedBox(height: 8),
_IbanInput(),
_PhoneInput(),
const SizedBox(height: 8),
]);
}
@@ -444,8 +372,6 @@ class SignUpForm extends StatelessWidget {
const SizedBox(height: 8),
_SignUpButton(),
const SizedBox(height: 8),
_DebugButton(),
const SizedBox(height: 8),
_ResetButton(),
],
),
@@ -18,12 +18,13 @@ import 'dart:developer';
import 'package:wyatt_form_bloc/wyatt_form_bloc.dart';
class CustomFormCubit extends FormDataCubit {
CustomFormCubit({required FormData inputs}) : super(inputs: inputs);
class SimpleCustomFormCubit extends FormDataCubitImpl {
SimpleCustomFormCubit(super.form) : super();
@override
Future<void> submitForm() {
log(state.data.toMap().toString());
Future<void> submit() {
final value = FormJsonEncoder().encode(state.form);
log(value);
return Future.value();
}