OnUpdateState not invoke on parent recycler component #910
Description
@LayoutSpec
object InsuranceProductsComponentSpec {
@OnCreateLayout
fun onCreateLayout(
c: ComponentContext,
@Prop widgetDetails: WidgetDetails,
@State widgetDetailsModelState: ArrayList<WidgetComponentDetails>
): Component {
//widget backgroundcolor set from Json
return Column.create(c).backgroundColor(
if (widgetDetails.backgroundColor.isNullOrEmpty()) Color.TRANSPARENT else Color.parseColor(
widgetDetails.backgroundColor
)
).child(
financeTitleSection(c, widgetDetails.widgetName),
).child(
filterOptionSection(c, widgetDetailsModelState)
).child(
widgetDetailsModelState.let { loansSection(c, widgetDetailsModelState) }
).marginDip(YogaEdge.TOP, fs_16).build()
}
private fun filterOptionSection(
c: ComponentContext,
@State widgetDetails: ArrayList<WidgetComponentDetails>,
): Component {
return RecyclerCollectionComponent.create(c)
.recyclerConfiguration(
ListRecyclerConfiguration.create().orientation(OrientationHelper.HORIZONTAL)
.build()
).itemDecoration(HorizontalSpaceDecoration(5))
.section(
DataDiffSection.create<WidgetComponentDetails>(SectionContext(c))
.data(widgetDetails.distinctBy { it.filterTag })
.renderEventHandler(
InsuranceProductsComponent.onFilterLoanOptionRender(c)
)
.build()
).kotlinStyle(Style.padding(horizontal = 10.dp)).canMeasureRecycler(true)
.build()
}
private fun loansSection(
c: ComponentContext,
widgetDetails: ArrayList<WidgetComponentDetails>,
): Component {
//If Select ALL From ChipGroup All the Card Visible else Only those cards visible which type of filterTag is selected
val filterModel = ArrayList<WidgetComponentDetails>()
widgetDetails.find { it.isSelected }.let {
it?.let { widgetComponentDetails ->
if (widgetComponentDetails.filterTag.equals(CHIPGROUP_ALL_TAG)) {
filterModel.addAll(widgetDetails)
} else {
widgetDetails.forEach { model ->
if (widgetComponentDetails.filterTag.equals(model.filterTag, true)) {
filterModel.add(model)
}
}
}
}
}
return RecyclerCollectionComponent.create(c)
.recyclerConfiguration(
ListRecyclerConfiguration.create().snapMode(SnapUtil.SNAP_TO_CENTER)
.orientation(OrientationHelper.HORIZONTAL)
.build()
).itemDecoration(HorizontalSpaceDecoration(7))
.section(
DataDiffSection.create<WidgetComponentDetails>(SectionContext(c))
.data(filterModel)
.renderEventHandler(
InsuranceProductsComponent.onWidgetComponentDetailsRender(c)
)
.build()
).canMeasureRecycler(true)
.build()
}
@OnEvent(RenderEvent::class)
fun onFilterLoanOptionRender(
c: ComponentContext,
@FromEvent model: WidgetComponentDetails,
): RenderInfo {
val app_design_blue = c.applicationContext.resources.getString(0 + R.color.app_design_blue)
val appDesignWhite = c.applicationContext.resources.getString(0 + R.color.appDesignWhite)
return ComponentRenderInfo.create()
.component(
Card.create(c).content(
Text.create(c).alignSelf(YogaAlign.CENTER)
.kotlinStyle(Style.padding(horizontal = 15.dp, vertical = 7.dp))
.text(model.filterTag).textColor(
if (model.isSelected) Color.WHITE else Color.BLACK
).textSizeDip(fs_12).paddingDip(YogaEdge.TOP, FontSize.fs_2)
.heightPercent(FontSize.fs_100)
.textAlignment(Layout.Alignment.ALIGN_CENTER).build()
).cornerRadiusDip(fs_12).heightDip(FontSize.fs_30).cardBackgroundColor(
if (model.isSelected) Color.parseColor(app_design_blue) else Color.parseColor(
appDesignWhite
)
).transparencyEnabled(true)
.clickHandler(
InsuranceProductsComponent.onFilterLoanOptionClick(c, model)
).build()
)
.build()
}
@OnEvent(ClickEvent::class)
fun onCtaClick(c: ComponentContext, @Param ctaInfo: WidgetComponentDetails?) {
Router.routeToNextScreen(
c.applicationContext, RedirectionKeyValue(
ctaInfo?.redirectionKey.toString(),
ctaInfo?.redirectionValue.toString()
), RouterData()
)
}
@OnEvent(ClickEvent::class)
fun onFilterLoanOptionClick(
c: ComponentContext, @Param selectedValue: WidgetComponentDetails
) {
InsuranceProductsComponent.onUpdateState(c, selectedValue)
}
@OnEvent(RenderEvent::class)
fun onWidgetComponentDetailsRender(
context: ComponentContext,
@FromEvent model: WidgetComponentDetails
): RenderInfo {
val app_design_silver = context.resources.getString(0 + R.color.app_design_silver)
val app_design_black = context.resources.getString(0 + R.color.app_design_black)
val backgroundDrawable = getBackgroundDrawable(
GradientDrawable.RECTANGLE,
if (model.backgroundColor.isNullOrEmpty()) Color.TRANSPARENT else Color.parseColor(model.backgroundColor),
fs_1.roundToInt(), context.resources.getString(0 + R.color.app_design_blue), fs_12
)
val backgroundDrawable2 = getBackgroundDrawable(
GradientDrawable.RECTANGLE,
Color.WHITE, fs_1.roundToInt(), app_design_silver, fs_12
)
val imageUrl = model.imageIcon?.withAssetBaseUrl()
val patnerName = model.partnerName
val productName = model.productName
return ComponentRenderInfo.create()
.component(
if (!model.filterTag.equals(CHIPGROUP_ALL_TAG)) {
Column.create(context).alignContent(YogaAlign.FLEX_START)
.alignSelf(YogaAlign.FLEX_START).alignItems(YogaAlign.FLEX_START).child(
Column.create(context).background(backgroundDrawable).widthDip(fs_243)
.marginDip(YogaEdge.TOP, fs_16).marginDip(YogaEdge.START, fs_12)
.heightDip(fs_127).child(
Column.create(context).child(
Row.create(context).child(
imageUrl?.let {
GlideImage.create(context)
.imageUrl(it)
.heightDip(fs_40)
.widthDip(fs_40)
.placeholderImage(
ContextCompat.getDrawable(
context.androidContext,
`in`.bajajfinservmarkets.shared.R.drawable.placeholder
)
)
.aspectRatio(fs_1)
.centerCrop(false)
.build()
}
).child(
Column.create(context).child(
Text.create(context).text(patnerName)
.typeface(
context.applicationContext.typeFace(
FontType.REGULAR
)
)
.isSingleLine(true)
.textColor(Color.parseColor(app_design_silver))
.textSizeSp(fs_12)
).child(
Text.create(context).text(productName)
.typeface(
context.applicationContext.typeFace(
FontType.BOLD
)
)
.isSingleLine(true)
.textColor(Color.parseColor(app_design_black))
.textSizeSp(fs_14)
).marginDip(YogaEdge.START, fs_8)
).marginDip(YogaEdge.END, fs_12)
.marginDip(YogaEdge.START, fs_12)
.marginDip(YogaEdge.BOTTOM, fs_10)
.marginDip(YogaEdge.TOP, fs_10)
).child(
Column.create(context).background(backgroundDrawable2)
.justifyContent(YogaJustify.CENTER)
.alignSelf(YogaAlign.CENTER)
.alignContent(YogaAlign.CENTER)
.marginDip(YogaEdge.START, fs_12)
.marginDip(YogaEdge.END, fs_12)
.widthDip(FontSize.fs_219)
.heightDip(53f)
.child(
Row.create(context).marginDip(YogaEdge.START, fs_12)
.child(
renderSumAssuredView(
model,
context,
app_design_black
)
).build()
)
)
).build()
).build()
} else {
Column.create(context).heightDip(FontSize.fs_159).widthDip(fs_0).build()
}
).build()
}
private fun renderSumAssuredView(
model: WidgetComponentDetails,
context: ComponentContext,
app_design_black: String
): Component {
if (!model.sumAssured.isNullOrEmpty()) {
return Column.create(context).child(
Text.create(context)
.text(
context.resources.getString(
`in`.bajajfinservmarkets.app.R.string.sumAssured
)
)
.typeface(
context.applicationContext.typeFace(
FontType.REGULAR
)
)
.isSingleLine(true)
.textColor(
Color.parseColor(
app_design_black
)
)
.textSizeSp(fs_10)
).child(
Text.create(context)
.text(model.sumAssured.toString())
.typeface(
context.applicationContext.typeFace(
FontType.BOLD
)
)
.isSingleLine(true)
.textColor(
Color.parseColor(
app_design_black
)
)
.textSizeSp(fs_16)
).build()
} else {
return EmptyComponent()
}
}
@OnUpdateState
fun onUpdateState(
widgetDetailsModelState: StateValue<ArrayList<WidgetComponentDetails>>,
@Param newOption: WidgetComponentDetails
) {
val existingList = widgetDetailsModelState.get()
val updatedList = ArrayList<WidgetComponentDetails>()
if (existingList != null) {
existingList.map {
updatedList.add(
WidgetComponentDetails(
isSelected = newOption.filterTag == it.filterTag,
filterTag = it.filterTag,
emi = it.emi,
partnerName = it.partnerName,
productName = it.productName,
loanAmount = it.loanAmount,
backgroundColor = it.backgroundColor,
imageIcon = it.iconBackgroundColor,
redirectionKey = it.redirectionKey,
redirectionValue = it.redirectionValue,
tag = it.tag,
name = it.name,
tagBgColor = it.tagBgColor,
tagTextColor = it.tagTextColor,
jsonLink = it.jsonLink,
iconBackgroundColor = it.iconBackgroundColor,
analytics = it.analytics,
sumAssured = it.sumAssured,
colourCode = it.colourCode,
sectionID = it.sectionID,
sectionName = it.sectionName,
ctaText = it.ctaText,
itemCount = it.itemCount,
partners_list = it.partners_list
)
)
}
}
widgetDetailsModelState.set(updatedList)
}
@OnCreateInitialState
fun onInitialState(
c: ComponentContext,
@Prop widgetDetails: WidgetDetails,
widgetDetailsModelState: StateValue<ArrayList<WidgetComponentDetails>>
) {
widgetDetails.widgetComponentDetails?.find { !it.filterTag.equals(Constants.CHIPGROUP_ALL_TAG) }
.let {
widgetDetails.widgetComponentDetails?.apply {
val widgetComponentDetailsTemp =
WidgetComponentDetails(
filterTag = Constants.CHIPGROUP_ALL_TAG,
isSelected = true
)
this.add(0, widgetComponentDetailsTemp)
}
}
widgetDetailsModelState.set(widgetDetails.widgetComponentDetails)
}
}
OnUpdateState not invoke on parent recycler component . Please Help.