@@ -2,7 +2,6 @@ import { Accessor, For, Resource, Setter } from "solid-js";
22
33import type { Benefit , CheckConfig , EligibilityCheck } from "@/types" ;
44
5-
65export type EligibilityCheckListMode = "user-defined" | "public" ;
76interface CheckModeConfig {
87 mode : EligibilityCheckListMode ;
@@ -19,7 +18,8 @@ const PublicCheckConfig: CheckModeConfig = {
1918const UserDefinedCheckConfig : CheckModeConfig = {
2019 mode : "user-defined" ,
2120 title : "User defined eligibility checks" ,
22- description : "Browse and select your own custom checks to add to your benefit." ,
21+ description :
22+ "Browse and select your own custom checks to add to your benefit." ,
2323 buttonTitle : "Your checks" ,
2424} ;
2525
@@ -32,31 +32,42 @@ const UserDefinedCheckConfig: CheckModeConfig = {
3232 - publicChecks: resource containing the list of public eligibility checks
3333 - userDefinedChecks: resource containing the list of user-defined eligibility checks
3434*/
35- const EligibilityCheckListView = (
36- { benefit, addCheck, removeCheck, mode, setMode, publicChecks, userDefinedChecks } :
37- {
38- benefit : Accessor < Benefit > ;
39- addCheck : ( newCheck : CheckConfig ) => void ;
40- removeCheck : ( indexToRemove : number ) => void ;
41- mode : Accessor < EligibilityCheckListMode > ,
42- setMode : Setter < EligibilityCheckListMode > ,
43- publicChecks : Resource < EligibilityCheck [ ] > ,
44- userDefinedChecks : Resource < EligibilityCheck [ ] > ,
45- }
46- ) => {
47- const activeCheckConfig : Accessor < CheckModeConfig > = (
48- ( ) => mode ( ) === "public" ? PublicCheckConfig : UserDefinedCheckConfig
49- ) ;
50- const activeChecks : Accessor < Resource < EligibilityCheck [ ] > > = (
51- ( ) => mode ( ) === "public" ? publicChecks : userDefinedChecks
52- ) ;
35+ const EligibilityCheckListView = ( {
36+ benefit,
37+ addCheck,
38+ removeCheck,
39+ mode,
40+ setMode,
41+ publicChecks,
42+ userDefinedChecks,
43+ } : {
44+ benefit : Accessor < Benefit > ;
45+ addCheck : ( newCheck : CheckConfig ) => void ;
46+ removeCheck : ( indexToRemove : number ) => void ;
47+ mode : Accessor < EligibilityCheckListMode > ;
48+ setMode : Setter < EligibilityCheckListMode > ;
49+ publicChecks : Resource < EligibilityCheck [ ] > ;
50+ userDefinedChecks : Resource < EligibilityCheck [ ] > ;
51+ } ) => {
52+ const activeCheckConfig : Accessor < CheckModeConfig > = ( ) =>
53+ mode ( ) === "public" ? PublicCheckConfig : UserDefinedCheckConfig ;
54+ const activeChecks : Accessor < Resource < EligibilityCheck [ ] > > = ( ) =>
55+ mode ( ) === "public" ? publicChecks : userDefinedChecks ;
5356 const onEligibilityCheckToggle = ( check : EligibilityCheck ) => {
54- const isCheckSelected = benefit ( ) . checks . some ( ( selected ) => selected . checkId === check . id ) ;
57+ const isCheckSelected = benefit ( ) . checks . some (
58+ ( selected ) => selected . checkId === check . id
59+ ) ;
5560 if ( isCheckSelected ) {
56- const checkIndexToRemove = benefit ( ) . checks . findIndex ( ( selected ) => selected . checkId === check . id ) ;
61+ const checkIndexToRemove = benefit ( ) . checks . findIndex (
62+ ( selected ) => selected . checkId === check . id
63+ ) ;
5764 removeCheck ( checkIndexToRemove ) ;
5865 } else {
59- const checkConfig : CheckConfig = { checkId : check . id , parameters : { } } ;
66+ const checkConfig : CheckConfig = {
67+ checkId : check . id ,
68+ checkName : check . name ,
69+ parameters : { } ,
70+ } ;
6071 addCheck ( checkConfig ) ;
6172 }
6273 } ;
@@ -65,14 +76,18 @@ const EligibilityCheckListView = (
6576 < >
6677 < div class = "p-4" >
6778 < div class = "flex items-center mb-2" >
68- < div class = "text-2xl font-bold" >
69- { activeCheckConfig ( ) . title }
70- </ div >
79+ < div class = "text-2xl font-bold" > { activeCheckConfig ( ) . title } </ div >
7180 < div class = "ml-auto flex gap-2" >
72- < For each = { [ PublicCheckConfig , UserDefinedCheckConfig ] as CheckModeConfig [ ] } >
81+ < For
82+ each = {
83+ [ PublicCheckConfig , UserDefinedCheckConfig ] as CheckModeConfig [ ]
84+ }
85+ >
7386 { ( modeOption ) => (
7487 < div
75- class = { `btn-default ${ mode ( ) === modeOption . mode ? "btn-blue" : "btn-gray" } ` }
88+ class = { `btn-default ${
89+ mode ( ) === modeOption . mode ? "btn-blue" : "btn-gray"
90+ } `}
7691 onClick = { ( ) => setMode ( modeOption . mode ) }
7792 title = { modeOption . buttonTitle }
7893 >
@@ -82,9 +97,7 @@ const EligibilityCheckListView = (
8297 </ For >
8398 </ div >
8499 </ div >
85- < div >
86- { activeCheckConfig ( ) . description }
87- </ div >
100+ < div > { activeCheckConfig ( ) . description } </ div >
88101 </ div >
89102 < table class = "table-auto w-full mt-4 border-collapse" >
90103 < thead >
@@ -102,7 +115,7 @@ const EligibilityCheckListView = (
102115 </ td >
103116 </ tr >
104117 ) }
105- { ( activeChecks ( ) ( ) && activeChecks ( ) ( ) . length === 0 ) && (
118+ { activeChecks ( ) ( ) && activeChecks ( ) ( ) . length === 0 && (
106119 < tr >
107120 < td colSpan = { 3 } class = "p-4 font-bold text-center text-gray-600" >
108121 No checks available.
@@ -124,15 +137,17 @@ const EligibilityCheckListView = (
124137 ) ;
125138} ;
126139
127- const EligibilityCheckRow = (
128- { check, selectedCheckConfigs, onToggle } :
129- {
130- check : EligibilityCheck ;
131- selectedCheckConfigs : CheckConfig [ ] ;
132- onToggle : ( check : EligibilityCheck ) => void ;
133- }
134- ) => {
135- const isCheckSelected = ( ) => selectedCheckConfigs . some ( ( selected ) => selected . checkId === check . id ) ;
140+ const EligibilityCheckRow = ( {
141+ check,
142+ selectedCheckConfigs,
143+ onToggle,
144+ } : {
145+ check : EligibilityCheck ;
146+ selectedCheckConfigs : CheckConfig [ ] ;
147+ onToggle : ( check : EligibilityCheck ) => void ;
148+ } ) => {
149+ const isCheckSelected = ( ) =>
150+ selectedCheckConfigs . some ( ( selected ) => selected . checkId === check . id ) ;
136151
137152 return (
138153 < tr >
@@ -144,11 +159,9 @@ const EligibilityCheckRow = (
144159 onChange = { ( ) => onToggle ( check ) }
145160 />
146161 </ td >
162+ < td class = "eligibility-check-table-cell border-top" > { check . name } </ td >
147163 < td class = "eligibility-check-table-cell border-top" >
148- { check . name }
149- </ td >
150- < td class = "eligibility-check-table-cell border-top" >
151- { check . description }
164+ { check . description }
152165 </ td >
153166 </ tr >
154167 ) ;
0 commit comments