import React, { useEffect, useState } from 'react'; import { SvgXml } from 'react-native-svg'; import { Cfg } from './action'; const iCons: { [key: string]: any } = { setting: require('../../assets/icons/setting.svg') ,settingWhite: require('../../assets/icons/setting-white.svg') , dashboard: require('../../assets/icons/dashboard.svg') , box: require('../../assets/icons/box.svg') , order: require('../../assets/icons/order.svg') , roomOrder: require('../../assets/icons/roomOrder.svg') , history: require('../../assets/icons/history.svg') , profile: require('../../assets/icons/profile.svg') } const iConsSvg: { [key: string]: any } = { setting: ` ` ,settingWhite: ` ` , dashboard: ` ` , box: ` ` , order: ` ` , roomOrder: ` ` , history: ` ` , profile: ` ` } export function SvgRenderer({ ...props }: { [key: string]: any; }) { const [svgData, setSvgData] = useState(null); const { tnode } = props; const { domNode } = tnode; const { attribs } = domNode; const onPress = () => { const config = Cfg.action as { [key: string]: (event: Function) => void }; const custAction: ((event: Function) => void) | null = (attribs?.action && typeof config[attribs?.action] === 'function') ? config[attribs?.action] : null; if (custAction) { attribs.pop = custAction; custAction(attribs); } } useEffect(() => { const loadSvg = async () => { try { if(attribs?.icon && attribs.icon in iCons){ const svgContent = iConsSvg[attribs.icon]; setSvgData(svgContent); } } catch (error) { console.error('Error loading SVG:', error); } }; if (attribs.icon) { loadSvg(); } }, [attribs.icon]); return ( ); }