feat: 🎸 form builder + components shared library #74

eladzipper96 · 2023-02-26T16:11:03Z

✅ Closes: #72

PR Checklist

Please check if your PR fulfills the following requirements:

The commit message follows our guidelines: CONTRIBUTING.md
Tests for the changes have been added (for bug fixes / features)
Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

adds a library for shared components and a component for dynamic form

[ ] Bugfix
[x] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Documentation content changes
[ ] Other... Please describe:

What is the current behavior?

none

Issue Number: N/A

none

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

Example of Component Generator (not included in this pr)

✅ Closes: #72

nx-cloud · 2023-02-26T16:11:07Z

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 7afa6d7. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

✅ Successfully ran 3 targets

Sent with 💌 from NxCloud.

codecov · 2023-02-26T16:51:02Z

Codecov Report

Merging #74 (7afa6d7) into master (5b35eeb) will increase coverage by 1.31%.
The diff coverage is 92.85%.

@@            Coverage Diff             @@
##           master      #74      +/-   ##
==========================================
+ Coverage   67.71%   69.02%   +1.31%     
==========================================
  Files          48       50       +2     
  Lines         254      268      +14     
  Branches       14       14              
==========================================
+ Hits          172      185      +13     
- Misses         82       83       +1

Flag	Coverage Δ
cli-daemon	`55.00% <ø> (ø)`
cli-gui	`93.93% <ø> (ø)`
configuration	`100.00% <ø> (ø)`
executors	`100.00% <ø> (ø)`
generators	`77.77% <ø> (ø)`
shared	`92.85% <92.85%> (∅)`
workspace-manager	`100.00% <ø> (ø)`

Impacted Files	Coverage Δ
...nts/src/lib/form-builder/form-builder.component.ts	`92.30% <92.30%> (ø)`
...s/src/lib/form-builder/form-builder.component.html	`100.00% <100.00%> (ø)`

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

Danieliverant

We talked about not having a form-builder, what changed?

ronnetzer · 2023-02-28T12:33:29Z

libs/shared/data/src/lib/form-builder.interface.ts

@@ -0,0 +1,11 @@
+import { FormlyFieldConfig, FormlyFormOptions } from '@ngx-formly/core';
+
+export interface IFormData {


I'm not a fan of the I prefix for interfaces, if its done in other interfaces keep it but if not remove it

Me either. The thing is that in a bunch of cases, we need Dto class and exactly the same interface for the FE. So, I had to add it.

ronnetzer · 2023-02-28T12:34:08Z

libs/shared/data/src/lib/form-builder.interface.ts

@@ -0,0 +1,11 @@
+import { FormlyFieldConfig, FormlyFormOptions } from '@ngx-formly/core';
+
+export interface IFormData {


redundant interface, its equivalent to Record<string, any>

ronnetzer · 2023-02-28T12:35:00Z

libs/shared/data/src/lib/form-builder.interface.ts

+
+export type IFormField = FormlyFieldConfig;
+
+export type IFormFields = Array<IFormField>;


redundant, just do IFormField[] where its needed (prefer to be explicit as its more readable IMO)

ronnetzer · 2023-02-28T12:38:10Z

libs/shared/components/README.md

@@ -0,0 +1,7 @@
+# shared-components


recreate the lib as "dynamic-form" outside of shared (shared is for things that are also used in the daemon)
im also suggesting dynamic-form instead of components because this lib will also have custom fields, validators, etc

ronnetzer · 2023-02-28T12:43:40Z

libs/shared/components/src/lib/form-builder/form-builder.component.ts

+  selector: 'cli-form-builder',
+  standalone: true,
+  imports: [
+    CommonModule,


remove and import specific parts of it if needed

ronnetzer · 2023-02-28T12:44:12Z

libs/shared/components/src/lib/form-builder/form-builder.component.ts

+  imports: [
+    CommonModule,
+    FormlyModule,
+    FormlyMaterialModule,


this should be imported only where you do FormlyModule.forRoot

ronnetzer · 2023-02-28T12:45:57Z

libs/shared/data/src/lib/form-builder.interface.ts

@@ -0,0 +1,11 @@
+import { FormlyFieldConfig, FormlyFormOptions } from '@ngx-formly/core';


In general, unless you're making your own interfaces and mappers between these types, I don't see any benefit of this file and IMO we should use formly models directly

ronnetzer · 2023-02-28T12:47:55Z

pnpm-lock.yaml

@@ -181,6 +181,16 @@ importers:
      '@angular/core': 15.1.5_rxjs@7.5.7+zone.js@0.11.8
      tslib: 2.5.0

+  libs/shared/components:


is pnpm-workspaces file still exists? if so remove it, revert this file, remove node_modules, and run pnpm i again

pull and resolve conflicts, it'll probably fix it

ronnetzer · 2023-02-28T12:52:46Z

We talked about not having a form-builder, what changed?

I agree with @Danieliverant about this, unless we make our own providers that wrap formly's providers and add extra functionality I don't see any reason to have this component

eladzipper96 added 2 commits February 26, 2023 17:51

feat: 🎸 form builder + components shared library

b1cd307

✅ Closes: #72

fix: 🐛 wrong props binding in form

18f8e90

eladzipper96 requested review from agroupp, Danieliverant and ronnetzer February 26, 2023 16:16

fix: 🐛 fix pnpm-lock

7afa6d7

Danieliverant reviewed Feb 27, 2023

View reviewed changes

ronnetzer requested a review from a team February 28, 2023 12:30

ronnetzer requested changes Feb 28, 2023

View reviewed changes

eladzipper96 closed this Mar 1, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: 🎸 form builder + components shared library #74

feat: 🎸 form builder + components shared library #74

eladzipper96 commented Feb 26, 2023 •

edited

Loading

nx-cloud bot commented Feb 26, 2023 •

edited

Loading

codecov bot commented Feb 26, 2023 •

edited

Loading

Danieliverant left a comment

ronnetzer Feb 28, 2023

agroupp Mar 1, 2023

ronnetzer Feb 28, 2023

ronnetzer Feb 28, 2023

ronnetzer Feb 28, 2023

ronnetzer Feb 28, 2023

ronnetzer Feb 28, 2023

ronnetzer Feb 28, 2023

ronnetzer Feb 28, 2023

ronnetzer Feb 28, 2023

ronnetzer commented Feb 28, 2023

		@@ -0,0 +1,11 @@
		import { FormlyFieldConfig, FormlyFormOptions } from '@ngx-formly/core';

		export interface IFormData {


		export type IFormField = FormlyFieldConfig;

		export type IFormFields = Array<IFormField>;

feat: 🎸 form builder + components shared library #74

feat: 🎸 form builder + components shared library #74

Conversation

eladzipper96 commented Feb 26, 2023 • edited Loading

PR Checklist

PR Type

What is the current behavior?

Does this PR introduce a breaking change?

Other information

nx-cloud bot commented Feb 26, 2023 • edited Loading

☁️ Nx Cloud Report

codecov bot commented Feb 26, 2023 • edited Loading

Codecov Report

Danieliverant left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ronnetzer commented Feb 28, 2023

eladzipper96 commented Feb 26, 2023 •

edited

Loading

nx-cloud bot commented Feb 26, 2023 •

edited

Loading

codecov bot commented Feb 26, 2023 •

edited

Loading