diff options
Diffstat (limited to 'sdnr/wt/odlux/framework/src/components/objectDump/index.tsx')
-rw-r--r-- | sdnr/wt/odlux/framework/src/components/objectDump/index.tsx | 205 |
1 files changed, 0 insertions, 205 deletions
diff --git a/sdnr/wt/odlux/framework/src/components/objectDump/index.tsx b/sdnr/wt/odlux/framework/src/components/objectDump/index.tsx deleted file mode 100644 index 10a0547be..000000000 --- a/sdnr/wt/odlux/framework/src/components/objectDump/index.tsx +++ /dev/null @@ -1,205 +0,0 @@ -/** - * ============LICENSE_START======================================================================== - * ONAP : ccsdk feature sdnr wt odlux - * ================================================================================================= - * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved. - * ================================================================================================= - * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except - * in compliance with the License. You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software distributed under the License - * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express - * or implied. See the License for the specific language governing permissions and limitations under - * the License. - * ============LICENSE_END========================================================================== - */ - -import * as React from "react"; -import makeStyles from '@mui/styles/makeStyles'; - -export const getTypeName = (obj: any): string => { - if (obj == null) { - return obj === undefined ? "Undefined" : "Null"; - } - return Object.prototype.toString.call(obj).slice(8, -1); -}; - -const isObjectLike = (obj: any) => { - return typeof obj === "object" && obj !== null; -}; - -const isBoolean = (obj: any) => { - return obj === true || obj === false || - (isObjectLike(obj) && getTypeName(obj) === "Boolean"); -}; - -const isNumber = (obj: any) => { - return typeof obj === "number" || - (isObjectLike(obj) && getTypeName(obj) === "Number"); -}; - -const isString = (obj: any) => { - return typeof obj === "string" || - (isObjectLike(obj) && getTypeName(obj) === "String"); -}; - -const isNull = (obj: any) => { - return obj === null; -}; - -const isDate = (obj: any): boolean => { - return isObjectLike(obj) && (obj instanceof Date); -}; - -const useSimpleTableStyles = makeStyles({ - root: { - }, - table: { - fontFamily: "verdana, arial, helvetica, sans-serif", - borderSpacing: "3px", - borderCollapse: "separate", - marginLeft: "30px" - }, - label: { - cursor: "pointer", - }, - th: { - textAlign: "left", - color: "white", - padding: "5px", - backgroundColor: "#cccccc", - - }, - td: { - verticalAlign: "top", - padding: "0.5rem 1rem", - border: "2px solid #DDD" - }, - object: { - }, - objectTh: { - backgroundColor: "#cccccc", - }, - objectTd: { - padding: "0.5rem 1rem", - border: "2px solid #DDD" - }, - chevron: { - '&:before': { - borderStyle: 'solid', - borderWidth: '0.25em 0.25em 0 0', - content: '\'\'', - display: 'inline-block', - height: '0.45em', - left: '0.15em', - position: 'relative', - top: '0.15em', - transform: 'rotate(-45deg)', - transition: 'all 0.3s', - verticalAlign: 'top', - width: '0.45em', - } - - }, - right: { - '&:before': { - left: '0', - transform: 'rotate(45deg)', - } - }, - bottom: { - '&:before': { - left: '0', - transform: 'rotate(135deg)', - } - }, -}); - - -type SimpleTableProps = { - classNameTh?: string; - label?: JSX.Element | string | null; - cols?: number; - expand?: boolean; - ariaLabel?: string; -} - -const SimpleTable: React.FC<SimpleTableProps> = (props) => { - const { label = '', cols = 2, expand = true, classNameTh, children } = props; - const [isExpanded, setIsExpanded] = React.useState(expand); - - const classes = useSimpleTableStyles(); - - React.useEffect(() => { - setIsExpanded(expand); - }, [expand]); - - const handleClick = () => { - setIsExpanded(!isExpanded); - }; - - return ( - <table className={`${classes.root} ${classes.table}`} aria-label={props.ariaLabel? props.ariaLabel+'-table' : 'table'}> - {label && (<thead> - <tr aria-label={props.ariaLabel? props.ariaLabel+'-title-row' : 'title row'}> - <th className={`${classes.th} ${classes.label} ${classNameTh ? classNameTh : ''}`} colSpan={cols} onClick={handleClick}> - <span className={`${classes.chevron} ${isExpanded ? classes.bottom : classes.right }`}></span> { label } - </th> - </tr> - </thead>) || null - } - {isExpanded && <tbody >{children}</tbody> || null} - </table> - ); -}; - - -type ObjectRendererProps = { - className?: string; - label?: JSX.Element | string | null; - expand?: boolean; - object: { [key: string]: any }; - ariaLabel?: string; -}; - -const ObjectRenderer: React.FC<ObjectRendererProps> = (props) => { - const { object, className, label = 'Object', expand = true } = props; - const classes = useSimpleTableStyles(); - - return ( - <SimpleTable ariaLabel={props.ariaLabel} classNameTh={classes.objectTh} label={getTypeName(object) || label} expand={expand}> - { - Object.keys(object).map(key => { - return ( - <tr key={String(key)} aria-label={props.ariaLabel? props.ariaLabel+'-row': 'row'}> - <td className={`${classes.td} ${classes.objectTd}`} aria-label="object-title">{String(key)} </td> - <td className={`${classes.td}`} aria-label="object-details">{renderObject(object[key], "sub-element")}</td> - </tr> - ); - }) - } - </SimpleTable> - ); -}; - - -type ArrayRendererProps = { - label?: JSX.Element | string | null; - extraRenderer?: { [label: string]: React.ComponentType<{ label?: JSX.Element | string | null; object: any; }> }; - description?: string; - object: any; -}; - -const ArrayRenderer: React.FC<ArrayRendererProps> = (props) => { - - return null; -}; - -export const renderObject = (object: any, ariaLabel?: string): JSX.Element | string => { - if (isString(object) || isNumber(object) || isBoolean(object)) { - return String(object); - } - return <ObjectRenderer object={object} ariaLabel={ariaLabel} />; -}; |