Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
languagejs
titlesrc/rc/flexwidget/MyFlexWidget.js
import { CARD } from "fw-types";
import FWProps, { parseToDefaultProps, parseToPropTypes } from "fw-props";
import useOrdResolve from "btibCore/hook/niagara/useOrdResolve";
import { isComponent } from "btibCore/util/compUtils";
import React from "react";
 
// React Component
function MyFlexWidget(props) {
  const { componentOrd, background, foreground, flexProps } = props;
  const base = flexProps.value;
 
  // In BajaScript the resolution of an ORD in asynchrone
  const { value, isLoading, error } = useOrdResolve({ ord: componentOrd, base });
 
  if (isLoading) {
    return <div>Loading...</div>;
  }
 
  if (error || !isComponent(value)) {
    return <div>{error.toString() || "The ORD doesn't target a baja:Component"}</div>;
  }
 
  return (
    <div style={{ background, color: foreground }}>
      <h3>Component Info:</h3>
      <ul>
        <li>Name: {value.getName()}</li>
        <li>Type: {value.getType().toString()}</li>
        <li>Handle: {value.getHandle()}</li>
        <li>Nav ORD: {value.getNavOredgetNavOrd().toString()}</li>
        <li>Permissions: {value.getPermissions().toString()}</li>
      </ul>
    </div>
  );
}
 
MyFlexWidget.fwTypes = CARD;
 
MyFlexWidget.fwProps = {
  componentOrd: FWProps.ord.isRequired,
  background: FWProps.color("#ebebeb"),
  foreground: FWProps.color("#4d4d4d"),
};
 
MyFlexWidget.defaultProps = parseToDefaultProps(MyFlexWidget.fwProps);
 
MyFlexWidget.propTypes = parseToPropTypes(MyFlexWidget.fwProps);
 
export default MyFlexWidget;

...