{"version":3,"file":"EnvironmentRibbon.mjs","names":["React","useMemo","useUser","makeStyles","useTenant","Typography","APP_RIBBON_SPACE","useBuildEnvironment","useStyles","root","width","height","backgroundColor","environment","color","display","alignItems","position","centerText","left","transform","fontWeight","rightText","right","EnvironmentRibbon","tenantInfo","buildEnvironment","classes","charAt","toUpperCase","slice","activeTenant","tenantName"],"sources":["../../../src/shell/ui/EnvironmentRibbon.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { useUser } from '../../utilities/auth/useUser';\n// @ts-ignore\nimport { makeStyles } from '@material-ui/core';\nimport { useTenant } from '../../utilities/tenant/useTenant';\nimport { Typography } from '../../UI/dataDisplay/typography/Typography';\nimport { APP_RIBBON_SPACE, useBuildEnvironment } from './useBuildEnvironment';\n\n\n\nconst useStyles = makeStyles({\n  root: {\n    width: '100vw',\n    height: APP_RIBBON_SPACE,\n    backgroundColor: ({environment}: {environment: string | undefined}) => `var(--env-ribbon-${environment})`,\n    color: '#ffffff', // Default white text\n    display: 'flex',\n    alignItems: 'center',\n    position: 'relative',\n    // Use CSS to handle staging text color\n    '&.staging': {\n      color: '#000000'\n    }\n  },\n\tcenterText: {\n    position: 'absolute',\n    left: '50%',\n    transform: 'translateX(-50%)',\n    fontWeight: 600\n\t},\n\trightText: {\n    position: 'absolute',\n    right: '10px',\n    fontWeight: 500\n\t}\n});\n\nexport const EnvironmentRibbon = () => {\n\tconst tenantInfo = useTenant()\n\tconst buildEnvironment = useBuildEnvironment()\n\n  const classes = useStyles({environment: buildEnvironment});\n  if(!buildEnvironment)  return null;\n\n  return (\n    <div\n      className={`${classes.root} ${buildEnvironment === 'staging' ? 'staging' : ''}`}\n      id='udp-environment-banner'\n    >\n      <Typography className={classes.centerText}>\n        {buildEnvironment?.charAt(0).toUpperCase()+buildEnvironment?.slice(1) || ''}\n      </Typography>\n\t\t\t<Typography className={classes.rightText}>\n        {tenantInfo?.activeTenant?.tenantName}\n      </Typography>\n    </div>\n  );\n};\n"],"mappings":";;;;;;AAUA,MAAMQ,YAAYL,WAAW;CAC3BM,MAAM;EACJC,OAAO;EACPC,QAAAA;EACAC,kBAAkB,EAACC,kBAAoD,oBAAoBA,YAAW;EACtGC,OAAO;EACPC,SAAS;EACTC,YAAY;EACZC,UAAU;EAEV,aAAa,EACXH,OAAO,WACT;EACD;CACFI,YAAY;EACTD,UAAU;EACVE,MAAM;EACNC,WAAW;EACXC,YAAY;EACd;CACDC,WAAW;EACRL,UAAU;EACVM,OAAO;EACPF,YAAY;EACf;CACA,CAAC;AAEF,MAAaG,0BAA0B;CACtC,MAAMC,aAAarB,WAAW;CAC9B,MAAMsB,mBAAmBnB,qBAAqB;CAE7C,MAAMoB,UAAUnB,UAAU,EAACK,aAAaa,kBAAiB,CAAC;AAC1D,KAAG,CAACA,iBAAmB,QAAO;AAE9B,QACE,sBAAA,cAAC,OAAD;EACE,WAAW,GAAGC,QAAQlB,KAAI,GAAIiB,qBAAqB,YAAY,YAAY;EAC3E,IAAG;EAQC,EANJ,sBAAA,cAAC,cAAD,EAAY,WAAWC,QAAQT,YAEnB,EADTQ,kBAAkBE,OAAO,EAAE,CAACC,aAAa,GAACH,kBAAkBI,MAAM,EAAE,IAAI,GAC/D,EACf,sBAAA,cAAC,cAAD,EAAY,WAAWH,QAAQL,WAEhB,EADTG,YAAYM,cAAcC,WACjB,CACR"}