@ltht-react/involved-team-summary 2.0.3 → 2.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ltht-react/involved-team-summary",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "description": "ltht-react clinical InvolvedTeamSummary component.",
   "author": "LTHT",
   "homepage": "",
@@ -8,7 +8,8 @@
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
   "files": [
-    "lib"
+    "lib",
+    "src"
   ],
   "directories": {
     "lib": "lib"
@@ -23,12 +24,12 @@
   "dependencies": {
     "@emotion/react": "^11.0.0",
     "@emotion/styled": "^11.0.0",
-    "@ltht-react/list": "^2.0.3",
-    "@ltht-react/styles": "^2.0.3",
-    "@ltht-react/type-summary": "^2.0.3",
-    "@ltht-react/types": "^2.0.3",
-    "@ltht-react/utils": "^2.0.3",
+    "@ltht-react/list": "^2.0.4",
+    "@ltht-react/styles": "^2.0.4",
+    "@ltht-react/type-summary": "^2.0.4",
+    "@ltht-react/types": "^2.0.4",
+    "@ltht-react/utils": "^2.0.4",
     "react": "^18.2.0"
   },
-  "gitHead": "6f18742bbf2f44123b6478257e52fbbdd291a25b"
+  "gitHead": "b8fe243323a0f1b9ab345475db38c73fd3b35312"
 }

package/src/atoms/involved-team-description.tsx

@@ -0,0 +1,22 @@
+import { HTMLAttributes, FC } from 'react'
+import styled from '@emotion/styled'
+
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import { EpisodeOfCare } from '@ltht-react/types'
+
+const StyledInvolvedTeamDescription = styled.div`
+  color: ${TEXT_COLOURS.SECONDARY.VALUE};
+  text-align: left;
+  font-size: smaller;
+  padding-top: 0.25rem;
+`
+
+const InvolvedTeamDescription: FC<Props> = ({ episodeOfCare, ...rest }) => (
+  <StyledInvolvedTeamDescription {...rest}>{episodeOfCare.careManager?.display}</StyledInvolvedTeamDescription>
+)
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  episodeOfCare: EpisodeOfCare
+}
+
+export default InvolvedTeamDescription

package/src/atoms/involved-team-title.tsx

@@ -0,0 +1,23 @@
+import { HTMLAttributes, FC } from 'react'
+import styled from '@emotion/styled'
+
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import { EpisodeOfCare } from '@ltht-react/types'
+import { resourceReferenceDisplaySummary } from '@ltht-react/utils'
+
+const StyledInvolvedTeamTitle = styled.div`
+  color: ${TEXT_COLOURS.PRIMARY};
+  text-align: left;
+`
+
+const InvolvedTeamTitle: FC<Props> = ({ episodeOfCare, ...rest }) => (
+  <StyledInvolvedTeamTitle {...rest}>
+    {episodeOfCare.team && resourceReferenceDisplaySummary(episodeOfCare.team)}
+  </StyledInvolvedTeamTitle>
+)
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  episodeOfCare: EpisodeOfCare
+}
+
+export default InvolvedTeamTitle

package/src/atoms/involved-team-type.tsx

@@ -0,0 +1,23 @@
+import { HTMLAttributes, FC } from 'react'
+import styled from '@emotion/styled'
+
+import { TEXT_COLOURS } from '@ltht-react/styles'
+import { EpisodeOfCare } from '@ltht-react/types'
+import { titleCase } from '@ltht-react/utils'
+
+const StyledInvolvedTeamType = styled.div`
+  color: ${TEXT_COLOURS.SECONDARY.VALUE};
+  text-align: right;
+  font-size: smaller;
+  padding-top: 0.25rem;
+`
+
+const InvolvedTeamType: FC<Props> = ({ episodeOfCare, ...rest }) => (
+  <StyledInvolvedTeamType {...rest}>{titleCase(episodeOfCare.status)}</StyledInvolvedTeamType>
+)
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  episodeOfCare: EpisodeOfCare
+}
+
+export default InvolvedTeamType

package/src/index.tsx

@@ -0,0 +1,3 @@
+import InvolvedTeamSummary from './organisms/involved-team-summary'
+
+export default InvolvedTeamSummary

package/src/molecules/involved-team-redacted.tsx

@@ -0,0 +1,33 @@
+import { HTMLAttributes, FC } from 'react'
+import styled from '@emotion/styled'
+
+import { EpisodeOfCare } from '@ltht-react/types'
+import { RedactedDescription, PeriodSummary } from '@ltht-react/type-summary'
+
+const StyledRedacted = styled.div`
+  display: flex;
+`
+const StyledDescription = styled.div`
+  flex: 1;
+`
+const StyledDate = styled.div`
+  flex: 1;
+  text-align: right;
+`
+
+const InvolvedTeamRedacted: FC<Props> = ({ episodeOfCare, ...rest }) => (
+  <StyledRedacted {...rest}>
+    <StyledDescription>
+      <RedactedDescription />
+    </StyledDescription>
+    <StyledDate>
+      <PeriodSummary period={episodeOfCare.period} />
+    </StyledDate>
+  </StyledRedacted>
+)
+
+interface Props extends HTMLAttributes<HTMLDivElement> {
+  episodeOfCare: EpisodeOfCare
+}
+
+export default InvolvedTeamRedacted

package/src/organisms/involved-team-summary.tsx

@@ -0,0 +1,46 @@
+import { FC } from 'react'
+import styled from '@emotion/styled'
+
+import { EpisodeOfCare } from '@ltht-react/types'
+import { PeriodSummary } from '@ltht-react/type-summary'
+
+import Description from '../atoms/involved-team-description'
+import Type from '../atoms/involved-team-type'
+import Title from '../atoms/involved-team-title'
+import Redacted from '../molecules/involved-team-redacted'
+
+const StyledSummary = styled.div`
+  display: flex;
+`
+const StyledDescription = styled.div`
+  flex: 1;
+`
+const StyledDate = styled.div`
+  flex: 1;
+  text-align: right;
+`
+
+const InvolvedTeamSummary: FC<Props> = ({ episodeOfCare }) => {
+  if (episodeOfCare.metadata.isRedacted) {
+    return <Redacted episodeOfCare={episodeOfCare} />
+  }
+
+  return (
+    <StyledSummary>
+      <StyledDescription>
+        <Title episodeOfCare={episodeOfCare} />
+        <Description episodeOfCare={episodeOfCare} />
+      </StyledDescription>
+      <StyledDate>
+        <PeriodSummary period={episodeOfCare.period} />
+        <Type episodeOfCare={episodeOfCare} />
+      </StyledDate>
+    </StyledSummary>
+  )
+}
+
+interface Props {
+  episodeOfCare: EpisodeOfCare
+}
+
+export default InvolvedTeamSummary