@redneckz/wildless-cms-uni-blocks 0.6.26 → 0.6.28

package/mobile/src/components/Calculator/renderCalculatorBlock.tsx

@@ -1,27 +1,24 @@
-import type { JSXBlock } from '../../model/JSXBlock';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import type { CalculatorBlockDef } from './CalculatorContent';
-import { EmbeddableCalcBlocks, EmbeddableCalcProps } from './EmbeddableCalcBlocks';
+import { EmbeddableCalcBlocks } from './EmbeddableCalcBlocks';
 
-export const renderCalculatorBlock =
-  ({ context, className }: any) =>
-  (block: CalculatorBlockDef, i: number) => {
-    const type = block?.calcType;
-    if (!type || !(type in EmbeddableCalcBlocks)) {
-      return null;
-    }
-    const EmbeddedBlock: JSXBlock<EmbeddableCalcProps> = EmbeddableCalcBlocks[type];
+export const renderCalculatorBlock = (block: CalculatorBlockDef, i: number) => {
+  const type = block?.calcType;
+  if (!type || !(type in EmbeddableCalcBlocks)) {
+    return null;
+  }
+  const EmbeddedBlock = EmbeddableCalcBlocks[type];
 
-    return (
-      <section
-        key={String(i)}
-        className={`box-border relative bg-white flex shrink-0 self-start basis-full ${className}`}
-        role="listitem"
-      >
-        <div className="box-border p-9 w-full">
-          {block?.title ? <Heading className="text-center mb-6" title={block.title} /> : null}
-          <EmbeddedBlock context={context} {...block} className="flex justify-between" />
-        </div>
-      </section>
-    );
-  };
+  return (
+    <section
+      key={String(i)}
+      className="box-border relative bg-white flex shrink-0 self-start basis-full"
+      role="listitem"
+    >
+      <div className="box-border p-9 w-full">
+        {block?.title ? <Heading className="text-center mb-6" title={block.title} /> : null}
+        <EmbeddedBlock {...block} className="flex justify-between" />
+      </div>
+    </section>
+  );
+};

package/mobile/src/components/CardTransfer/CardTransfer.tsx

@@ -25,21 +25,19 @@ export const CardTransfer = JSX<CardTransferProps>(
     label = DEFAULT_LABEL,
     placeholder = DEFAULT_PLACEHOLDER,
     button,
-    context,
     ...rest
   }) => {
-    const router = context.useRouter();
-    const { handlerDecorator } = context;
     const [value, setValue] = useState<string>('');
     const isDisabled = !Number(getSanitizedValue(value));
     const buttonStyle = isDisabled
       ? getDisabledButtonClasses({ version: button?.version })
       : getRegularButtonClasses({ className: 'text-white', version: button?.version });
 
+    const link = useLink();
+
     return (
       <BlockWrapper
         className={`p-[50px] flex flex-col items-center font-sans bg-white ${className}`}
-        context={context}
         {...rest}
       >
         {title ? <Heading className="max-w-[684px] pb-9" headingType="h2" title={title} /> : null}
@@ -57,7 +55,7 @@ export const CardTransfer = JSX<CardTransferProps>(
               type="submit"
               className={`w-full p-4 mt-6 ${buttonStyle} `}
               disabled={isDisabled}
-              {...useLink({ router, handlerDecorator }, button)}
+              {...link(button)}
             >
               {button.text}
             </button>

package/mobile/src/components/Catalog/Catalog.tsx

@@ -1,12 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useState } from '@redneckz/uni-jsx/lib/hooks';
+import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { BlockWrapper } from '../../ui-kit/BlockWrapper';
 import { renderArrows } from '../../ui-kit/Button/renderArrows';
-import type { ContentPageContext } from '../ContentPage/ContentPageContext';
 import { Headline } from '../Headline/Headline';
 import { CatalogCard } from './CatalogCard';
-import type { CatalogCardType, CatalogContent } from './CatalogContent';
+import type { CatalogContent } from './CatalogContent';
 
 export interface CatalogProps extends CatalogContent, UniBlockProps {}
 
@@ -15,34 +14,41 @@ const CARD_FULL_VIEW_COUNT = 3;
 const CARD_SHIFT = 430;
 
 export const Catalog = JSX<CatalogProps>(
-  ({ context, cards = [], className = '', title, description, ...rest }) => {
+  ({ cards = [], className = '', title, description, ...rest }) => {
     const [activeCardIndex, setActiveCardIndex] = useState(0);
 
+    const handleNextClick = useCallback(() => setActiveCardIndex((_) => _ + 1), []);
+    const handlePrevClick = useCallback(() => setActiveCardIndex((_) => _ - 1), []);
+
+    const isUseSlider = cards.length > CARD_FULL_VIEW_COUNT;
+    const showNextButton = isUseSlider && cards.length - activeCardIndex > CARD_FULL_VIEW_COUNT;
+    const showPrevButton = isUseSlider && activeCardIndex > 0;
+
     return (
       <BlockWrapper
-        context={context}
         className={`bg-white relative font-sans p-[50px] overflow-hidden text-center ${className}`}
         {...rest}
       >
         <Headline
-          context={context}
           className="!p-0"
           title={title}
           description={description}
           headlineVersion="M"
           align="center"
+          {...rest}
         />
         <div
           className="flex duration-1000 gap-3.5 mt-8"
           style={{ transform: `translateX(-${activeCardIndex * CARD_SHIFT}px)` }}
           role="list"
         >
-          {cards?.length ? cards.map(renderCatalogCard(context)) : null}
+          {cards?.length ? cards.map((card, i) => <CatalogCard key={String(i)} {...card} />) : null}
         </div>
-        {renderNavButtons({
-          cardsCount: cards.length,
-          activeCardIndex,
-          setActiveCardIndex,
+        {renderArrows({
+          handler: [handlePrevClick, handleNextClick],
+          isShown: [showPrevButton, showNextButton],
+          btnClass: ['left-8', 'right-8'],
+          className: 'top-1/2 z-10 mt-6',
         })}
         <div className={`${BLUR_BLOCK_CLASSES} left-0 bg-opacity-from-white`} />
         <div className={`${BLUR_BLOCK_CLASSES} right-0 bg-opacity-to-white`} />
@@ -50,33 +56,3 @@ export const Catalog = JSX<CatalogProps>(
     );
   },
 );
-
-const renderCatalogCard = (context: ContentPageContext) => (card: CatalogCardType, i: number) => {
-  return <CatalogCard key={String(i)} context={context} {...card} />;
-};
-
-interface RenderNavButtonsProps {
-  cardsCount: number;
-  activeCardIndex: number;
-  setActiveCardIndex: (index: number) => void;
-}
-
-const renderNavButtons = ({
-  cardsCount,
-  activeCardIndex,
-  setActiveCardIndex,
-}: RenderNavButtonsProps) => {
-  const handleNextClick = () => setActiveCardIndex(activeCardIndex + 1);
-  const handlePrevClick = () => setActiveCardIndex(activeCardIndex - 1);
-
-  const isUseSlider = cardsCount > CARD_FULL_VIEW_COUNT;
-  const showNextButton = isUseSlider && cardsCount - activeCardIndex > CARD_FULL_VIEW_COUNT;
-  const showPrevButton = isUseSlider && activeCardIndex > 0;
-
-  return renderArrows({
-    handler: [handlePrevClick, handleNextClick],
-    isShown: [showPrevButton, showNextButton],
-    btnClass: ['left-8', 'right-8'],
-    className: 'top-1/2 z-10 mt-6',
-  });
-};

package/mobile/src/components/Catalog/CatalogCard.tsx

@@ -1,13 +1,13 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { BlockVersion } from '../../model/BlockVersion';
-import type { UniBlockProps } from '../../model/JSXBlock';
 import type { ProductColorVersion } from '../../model/ProductColorVersion';
 import { renderButton } from '../../ui-kit/Button/ButtonSection';
 import { Heading } from '../../ui-kit/Heading/Heading';
 import { Img } from '../../ui-kit/Img/Img';
 import type { CatalogCardType } from './CatalogContent';
 
-export interface CatalogCardProps extends CatalogCardType, UniBlockProps {
+export interface CatalogCardProps extends CatalogCardType {
+  className?: string;
   version?: BlockVersion;
 }
 
@@ -17,28 +17,26 @@ const cardStyleMap: Record<ProductColorVersion, string> = {
 };
 
 export const CatalogCard = JSX<CatalogCardProps>(
-  ({ className = '', title, description, image, price, button, colors }) => {
-    return (
-      <section
-        className={`border border-solid box-border border-main-stroke p-[30px] min-w-[402px] flex flex-col justify-left ${className}`}
-        role="listitem"
-      >
-        {image?.src ? <Img className="mb-5 flex justify-center" image={image} /> : null}
-        {title ? (
-          <Heading headingType="h6" as="h4" className="text-left mb-1.5" title={title} />
-        ) : null}
-        {description ? <div className="text-m-light text-left mb-4">{description}</div> : null}
-        {colors?.length ? (
-          <div className="flex mb-4 text-s-light text-secondary-text">
-            <div className="mr-1.5">Доступные цвета: </div>
-            {colors.map(renderColorOption)}
-          </div>
-        ) : null}
-        {price ? <div className="text-h3 text-left">{price}&nbsp;₽</div> : null}
-        {button ? renderButton({ button, buttonClassName: 'mt-5 w-full' }) : null}
-      </section>
-    );
-  },
+  ({ className = '', title, description, image, price, button, colors }) => (
+    <section
+      className={`border border-solid box-border border-main-stroke p-[30px] min-w-[402px] flex flex-col justify-left ${className}`}
+      role="listitem"
+    >
+      {image?.src ? <Img className="mb-5 flex justify-center" image={image} /> : null}
+      {title ? (
+        <Heading headingType="h6" as="h4" className="text-left mb-1.5" title={title} />
+      ) : null}
+      {description ? <div className="text-m-light text-left mb-4">{description}</div> : null}
+      {colors?.length ? (
+        <div className="flex mb-4 text-s-light text-secondary-text">
+          <div className="mr-1.5">Доступные цвета: </div>
+          {colors.map(renderColorOption)}
+        </div>
+      ) : null}
+      {price ? <div className="text-h3 text-left">{price}&nbsp;₽</div> : null}
+      {button ? renderButton({ button, buttonClassName: 'mt-5 w-full' }) : null}
+    </section>
+  ),
 );
 
 const renderColorOption = (color: ProductColorVersion, i: number) => (

package/mobile/src/components/ComparisonTable/ComparisonTable.tsx

@@ -28,7 +28,7 @@ export const ComparisonTable = JSX<ComparisonTableProps>((props) => {
 });
 
 const TableInner = JSX<ComparisonTableProps>(
-  ({ columns, rowHeaders, isColoredFirstColumn, visibleRowLength, orientation, context }) => {
+  ({ columns, rowHeaders, isColoredFirstColumn, visibleRowLength, orientation, ...rest }) => {
     const [columnsViewState, setColumnsViewState] = useState(
       new Array<boolean>(columns?.length || 0).fill(!visibleRowLength),
     );
@@ -51,20 +51,18 @@ const TableInner = JSX<ComparisonTableProps>(
     const tableColumns = columns?.map(({ data, header }, colIndex) => (
       <TableColumn
         key={String(colIndex)}
-        context={context}
         visibleRowLength={visibleRowLength}
         showRow={columnsViewState[colIndex]}
         header={header}
         columnData={getColumnData(data)}
         isFillGradient={colIndex === 0 && isColoredFirstColumn}
         onToggleColumn={() => handleToggleColumn(colIndex)}
+        {...rest}
       />
     ));
 
     return orientation === 'horizontal' ? (
-      <SwipeListControl context={context} onSlideChange={handleSlideChange}>
-        {tableColumns}
-      </SwipeListControl>
+      <SwipeListControl onSlideChange={handleSlideChange}>{tableColumns}</SwipeListControl>
     ) : (
       tableColumns
     );

package/mobile/src/components/ComparisonTable/ComparisonTableBody.tsx

@@ -1,14 +1,11 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useTableArrowScrollControl } from '../../hooks/useTableArrowScrollControl';
-import { ContentPageContext } from '../ContentPage/ContentPageContext';
 import { ComparisonTableColumnHeaders } from './ComparisonTableColumnHeaders';
-import { Column, RowHeader } from './ComparisonTableContent';
+import type { Column, RowHeader } from './ComparisonTableContent';
 import { ComparisonTableRows } from './ComparisonTableRows';
 import { COLS_LENGTH_FOR_SCROLL } from './constants';
 
 interface ComparisonTableBodyProps {
-  context: ContentPageContext;
   columns?: Column[];
   rowHeaders?: RowHeader[];
   isShowAllRow: boolean;
@@ -17,10 +14,7 @@ interface ComparisonTableBodyProps {
 }
 
 export const ComparisonTableBody = JSX<ComparisonTableBodyProps>(
-  ({ context, columns, rowHeaders, isShowAllRow, visibleRowLength, isColoredFirstColumn }) => {
-    const router = context.useRouter();
-    const { handlerDecorator } = context;
-
+  ({ columns, rowHeaders, isShowAllRow, visibleRowLength, isColoredFirstColumn }) => {
     const colHeaders = columns?.map(({ header }) => header || {});
     const colData = columns?.map(({ data }) => data) || [];
     const rowData = rowHeaders
@@ -30,15 +24,11 @@ export const ComparisonTableBody = JSX<ComparisonTableBodyProps>(
       }))
       .slice(0, isShowAllRow ? rowHeaders.length : visibleRowLength);
 
-    const [activeCardIndex, setActiveCardIndex] = useState(0);
-
     const tableArrowScrollProps = useTableArrowScrollControl({
       columnsLength: colData.length,
       colsLengthForScroll: COLS_LENGTH_FOR_SCROLL,
-      activeCardIndex,
-      setActiveCardIndex,
     });
-    const { isScrollAvailable } = tableArrowScrollProps;
+    const { activeCardIndex, isScrollAvailable } = tableArrowScrollProps;
 
     return (
       <div>
@@ -47,14 +37,11 @@ export const ComparisonTableBody = JSX<ComparisonTableBodyProps>(
             <ComparisonTableColumnHeaders
               colHeaders={colHeaders}
               activeCardIndex={activeCardIndex}
-              router={router}
-              handlerDecorator={handlerDecorator}
             />
           ) : null}
           {rowData?.length ? (
             <ComparisonTableRows
               rowData={rowData}
-              activeCardIndex={activeCardIndex}
               isColoredFirstColumn={isColoredFirstColumn}
               {...tableArrowScrollProps}
             />

package/mobile/src/components/ComparisonTable/ComparisonTableColumnHeaders.tsx

@@ -1,6 +1,4 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useLink } from '../../hooks/useLink';
-import type { HandlerDecorator, Router } from '../ContentPage/ContentPageContext';
 import type { ColumnHeader } from './ComparisonTableContent';
 import { COLUMN_WIDTH, FIRST_CELL_CLASSES } from './constants';
 import { HeaderCell } from './HeaderCell';
@@ -10,25 +8,17 @@ import { TableRowContainer } from './TableRowContainer';
 interface ComparisonTableColumnHeadersProps {
   colHeaders: ColumnHeader[];
   activeCardIndex: number;
-  router: Router;
-  handlerDecorator: HandlerDecorator | undefined;
 }
 
 export const ComparisonTableColumnHeaders = JSX<ComparisonTableColumnHeadersProps>(
-  ({ colHeaders, activeCardIndex, router, handlerDecorator }) => {
-    return (
-      <TableRowContainer>
-        <div className={FIRST_CELL_CLASSES} role="columnheader" />
-        <TableCarouselContainer activeCardIndex={activeCardIndex} columnWidth={COLUMN_WIDTH}>
-          {colHeaders.map((header, i) => (
-            <HeaderCell
-              key={String(i)}
-              {...header}
-              link={header.link && useLink({ router, handlerDecorator }, header.link)}
-            />
-          ))}
-        </TableCarouselContainer>
-      </TableRowContainer>
-    );
-  },
+  ({ colHeaders, activeCardIndex }) => (
+    <TableRowContainer>
+      <div className={FIRST_CELL_CLASSES} role="columnheader" />
+      <TableCarouselContainer activeCardIndex={activeCardIndex} columnWidth={COLUMN_WIDTH}>
+        {colHeaders.map((header, i) => (
+          <HeaderCell key={String(i)} {...header} />
+        ))}
+      </TableCarouselContainer>
+    </TableRowContainer>
+  ),
 );

package/mobile/src/components/ComparisonTable/ComparisonTableRows.tsx

@@ -12,7 +12,7 @@ type ComparisonTableRowsProps = TableArrowScrollControlProps & {
 };
 
 export const ComparisonTableRows = JSX<ComparisonTableRowsProps>(
-  ({ rowData, activeCardIndex, isColoredFirstColumn, ...tableArrowScrollProps }) => {
+  ({ rowData, isColoredFirstColumn, ...tableArrowScrollProps }) => {
     return (
       <div className="relative">
         {rowData.map((row, i, { length }) => (
@@ -21,7 +21,7 @@ export const ComparisonTableRows = JSX<ComparisonTableRowsProps>(
             row={row}
             isFirstRow={i === 0}
             isLastRow={i + 1 === length}
-            activeCardIndex={activeCardIndex}
+            activeCardIndex={tableArrowScrollProps.activeCardIndex}
             isColoredFirstColumn={isColoredFirstColumn}
           />
         ))}

package/mobile/src/components/ContactsBlock/ContactsBlock.tsx

@@ -19,10 +19,9 @@ const contactsBlockStyleMap = {
 };
 
 export const ContactsBlock = JSX<ContactsBlockProps>(
-  ({ className = '', contacts, context, info, version = 'secondary', ...rest }) => {
+  ({ className = '', contacts, info, version = 'secondary', ...rest }) => {
     return (
       <BlockWrapper
-        context={context}
         className={`${contactsBlockStyleMap[version]} flex p-12 ${className}`}
         {...rest}
       >

package/mobile/src/components/ContentPage/ContentPage.tsx

@@ -5,7 +5,6 @@ import type { ContentPageDef } from '../../model/ContentPageDef';
 import type { JSXBlock, UniBlockProps } from '../../model/JSXBlock';
 import { style2className } from '../../utils/style2className';
 import { LikeControl } from '../LikeControl/LikeControl';
-import type { ContentPageContext } from './ContentPageContext';
 import { RenderBlockOptions } from './renderBlock';
 import { renderBlocksList } from './renderBlockList';
 import { renderSlots } from './renderSlots';
@@ -20,7 +19,7 @@ const defaultBlockDecorator: BlockDecorator = ({ blockClassName, block, render }
   render({ blockClassName, block });
 
 export const ContentPage: JSXBlock<ContentPageProps> = JSX<ContentPageProps>((props) => {
-  const { className = '', blocksRegistry, blockDecorator, context, data = {} } = props;
+  const { className = '', blocksRegistry, blockDecorator, data = {} } = props;
 
   const { style: pageStyle, blocks, slots, likeControl, colorPalette = 'pc' } = data;
 
@@ -29,7 +28,6 @@ export const ContentPage: JSXBlock<ContentPageProps> = JSX<ContentPageProps>((pr
     blocksRegistry,
     page: data,
     blockDecorator: blockDecorator || defaultBlockDecorator,
-    context,
   };
 
   const pageSlots = renderSlots({ slots, parent: data, options });
@@ -50,7 +48,7 @@ export const ContentPage: JSXBlock<ContentPageProps> = JSX<ContentPageProps>((pr
         </div>
       ) : null}
 
-      {likeControl ? renderLikeControl(context) : null}
+      {likeControl ? renderLikeControl() : null}
     </section>
   );
 });
@@ -58,14 +56,10 @@ export const ContentPage: JSXBlock<ContentPageProps> = JSX<ContentPageProps>((pr
 ContentPage.childrenTypes = [];
 ContentPage.slots = () => ['header', 'footer'];
 
-function renderLikeControl(context: ContentPageContext) {
+function renderLikeControl() {
   return (
     <div className="flex items-end absolute bottom-0 right-0 h-full pointer-events-none">
-      <LikeControl
-        key="LikeControl"
-        className="rounded-tl-lg sticky bottom-0 pointer-events-auto"
-        context={context}
-      />
+      <LikeControl className="rounded-tl-lg sticky bottom-0 pointer-events-auto" />
     </div>
   );
 }

package/mobile/src/components/ContentPage/renderBlock.tsx

@@ -2,7 +2,6 @@ import { BlockAncestors, BlockDecorator } from '../../model/BlockDecorator';
 import type { BlocksRegistry } from '../../model/BlocksRegistry';
 import type { BlockDef, ContentPageDef } from '../../model/ContentPageDef';
 import { style2className } from '../../utils/style2className';
-import type { ContentPageContext } from './ContentPageContext';
 import { renderBlocksList } from './renderBlockList';
 import { renderSlots } from './renderSlots';
 
@@ -11,7 +10,6 @@ export interface RenderBlockOptions {
   page: ContentPageDef;
   blockDecorator: BlockDecorator;
   blocksRegistry: BlocksRegistry;
-  context: ContentPageContext;
 }
 
 export interface RenderBlockProps {
@@ -21,7 +19,7 @@ export interface RenderBlockProps {
 }
 
 export function renderBlock({ block = {}, options, ancestors = [] }: RenderBlockProps) {
-  const { key, page, blockDecorator, blocksRegistry = {}, context } = options;
+  const { key, page, blockDecorator, blocksRegistry = {} } = options;
   const { type, slots, blocks: childBlocks } = block;
 
   if (!(type && type in blocksRegistry)) {
@@ -41,18 +39,15 @@ export function renderBlock({ block = {}, options, ancestors = [] }: RenderBlock
       ancestors,
       // Adjusted by decorator block and blockClassName
       render: ({ block: adjustedBlock, blockClassName: adjustedBlockClassName }) => {
-        const { version, anchor, labels, content } = adjustedBlock;
+        const { content } = adjustedBlock;
 
         return BlockComponent ? (
           <BlockComponent
             key={key}
-            className={adjustedBlockClassName}
-            context={context}
             page={page}
+            block={adjustedBlock}
+            className={adjustedBlockClassName}
             ancestors={ancestors}
-            version={version}
-            anchor={anchor}
-            labels={labels}
             slots={blockSlots}
             {...content}
           >

package/mobile/src/components/ContentPage/renderBlockList.tsx

@@ -12,28 +12,17 @@ interface RenderBlockListProps {
   ancestors?: BlockAncestors; // Recursion context
 }
 
-const defaultChildRenderer = (_: VNode) => _;
-
-export function renderBlocksList({
-  blocks = [],
+export const renderBlocksList = ({
+  blocks,
   parent,
   slotName = DEFAULT_SLOT_NAME,
   options,
   ancestors = [],
-}: RenderBlockListProps): Record<string, VNode> {
-  const { blocksRegistry = {} } = options;
-  const { type } = parent as BlockDef;
-  const BlockComponent = type && blocksRegistry[type];
-  const { renderChild = defaultChildRenderer } = BlockComponent || {};
-
-  return blocks.map((_: BlockDef, j: number) =>
-    renderChild(
-      renderBlock({
-        block: _,
-        options: { ...options, key: `${options.key ? options.key : _.type}-${j}` },
-        ancestors: [...ancestors, [parent, slotName]],
-      }),
-      j,
-    ),
+}: RenderBlockListProps): VNode[] =>
+  (blocks || []).map((_: BlockDef, j: number) =>
+    renderBlock({
+      block: _,
+      options: { ...options, key: `${options.key ? options.key : _.type}-${j}` },
+      ancestors: [...ancestors, [parent, slotName]],
+    }),
   );
-}

package/mobile/src/components/ContentPage/renderSlots.tsx

@@ -11,13 +11,13 @@ interface RenderSlotsProps {
   ancestors?: BlockAncestors;
 }
 
-export function renderSlots({
-  slots = {},
+export const renderSlots = ({
+  slots,
   parent,
   options,
   ancestors = [],
-}: RenderSlotsProps): Record<string, VNode> {
-  return Object.entries(slots).reduce(
+}: RenderSlotsProps): Record<string, VNode[]> =>
+  Object.entries(slots || {}).reduce(
     (res, [slotName, slotBlocks]) => ({
       ...res,
       [slotName]: renderBlocksList({
@@ -30,4 +30,3 @@ export function renderSlots({
     }),
     {},
   );
-}

package/mobile/src/components/ErrorBlock/ErrorBlock.tsx

@@ -1,5 +1,4 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useLink } from '../../hooks/useLink';
 import type { UniBlockProps } from '../../model/JSXBlock';
 import { Button } from '../../ui-kit/Button/Button';
 import { Heading } from '../../ui-kit/Heading/Heading';
@@ -21,27 +20,18 @@ const renderErrorContent = (error: ErrorBlockContent['error']) => {
 };
 
 export const ErrorBlock = JSX<ErrorBlockProps>(
-  ({ context, className = '', title, subtitle, error, button }) => {
-    const { useRouter, handlerDecorator } = context;
-    const router = useRouter();
-
-    return (
-      <section className={`flex flex-col justify-center items-center mt-12 ${className}`}>
-        <div className="flex justify-center py-20">{renderErrorContent(error)}</div>
-        {title ? <Heading headingType="h1" className="text-left mb-4" title={title} /> : null}
-        {subtitle ? (
-          <div className="font-sans text-xl-light mb-7 max-w-[613px] text-center">{subtitle}</div>
-        ) : null}
-        {button?.text ? (
-          <Button
-            className="py-4 px-9"
-            version={button?.version}
-            {...useLink({ router, handlerDecorator }, button)}
-          >
-            {button.text}
-          </Button>
-        ) : null}
-      </section>
-    );
-  },
+  ({ className = '', title, subtitle, error, button }) => (
+    <section className={`flex flex-col justify-center items-center mt-12 ${className}`}>
+      <div className="flex justify-center py-20">{renderErrorContent(error)}</div>
+      {title ? <Heading headingType="h1" className="text-left mb-4" title={title} /> : null}
+      {subtitle ? (
+        <div className="font-sans text-xl-light mb-7 max-w-[613px] text-center">{subtitle}</div>
+      ) : null}
+      {button?.text ? (
+        <Button className="py-4 px-9" version={button?.version} {...button}>
+          {button.text}
+        </Button>
+      ) : null}
+    </section>
+  ),
 );