How to convert

How to Convert?

• As we mentioned on the introduction, our plan for wider adoption of render components in ComponentKit is through CKCodeGen (ComponentKit Code Generation).
• However, If you'd like to benefit from the Render component's optimizations - it's ready for you to use it today.

From CKCompositeComponent

@interface InteractiveQuoteComponent : CKCompositeComponent
+ (instancetype)newWithQuote:(Quote *)quote context:(QuoteContext *)context;
@end
@implementation InteractiveQuoteComponent
+ (instancetype)newWithQuote:(Quote *)quote
{
  CKComponentScope scope(self);
  const BOOL revealAnswer = [scope.state() boolValue];
  CKComponent *overlay =
  revealAnswer
  ? [SuccessIndicatorComponent new]
  : nil;
  auto const c = [super newWithComponent:
                  [CKOverlayLayoutComponent
                    newWithComponent:
                     [QuoteComponent
                       newWithQuote:quote]
                     overlay:overlay]];
  return c;
}

To CKRenderComponent

@interface InteractiveQuoteComponent : CKRenderComponent
+ (instancetype)newWithQuote:(Quote *)quote context:(QuoteContext *)context;
@end
@implementation InteractiveQuoteComponent
{
  Quote *_quote;
}
+ (instancetype)newWithQuote:(Quote *)quote
{
  auto const c = [super new];
  if (c) {
   c->_quote = quote;
  }
  return c;
}
- (CKComponent *)render:(id)state
{
  const BOOL revealAnswer = [state boolValue];
  CKComponent *overlay =
  revealAnswer
  ? [SuccessIndicatorComponent new]
  : nil;
  return
  [super newWithComponent:
   [CKOverlayLayoutComponent
    newWithComponent:
    [QuoteComponent
     newWithQuote:quote]
     overlay:overlay]];
}