Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Localisation changes for different branding on different sites #249

Merged
merged 4 commits into from
May 7, 2024
Merged

Localisation changes for different branding on different sites #249

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
2e97afb
Added site localisation for title, header and footer text, and for th…
paolo7 May 1, 2024
b72f9dd
Restored relative path for logos
paolo7 May 1, 2024
24d0102
Updated logo and header/footer texts
paolo7 May 3, 2024
52e3b91
Update test site title
paolo7 May 7, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 25 additions & 1 deletion public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,31 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>TMH Registry</title>
<title>eRegistry</title>
<script>
window.onload = function() {
var domain = window.location.hostname;
// If domain is not recognised, default to Tanzania
var title = "eRegistry Tz";
if (window.location.hostname === 'tmh-registry-client.herokuapp.com') {
// Tanzania
title = "eRegistry Tz";
} else if (window.location.hostname === 'tmh-registry-client-gh-6a64e51863f6.herokuapp.com') {
// Ghana
title = "eRegistry Gh";
} else if (window.location.hostname === 'tmh-registry-client-sl.herokuapp.com') {
// Sierra Leone
title = "eRegistry SL";
} else if (window.location.hostname === 'tmh-registry-client-staging.herokuapp.com') {
// Staging site
title = "eRegistry TEST SITE";
} else if (window.location.hostname === 'localhost') {
// Localhost
title = "eRegistry LOCALHOST";
}
document.title = title;
};
</script>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
Expand Down
Binary file added src/assets/gh-logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 8 additions & 0 deletions src/assets/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,15 @@
import GHLogo from 'assets/gh-logo.png'
import SLLogo from 'assets/sl-logo.png';
import SwiftSSLogo from 'assets/swiftss-logo.png';
import TSALogoLocal from 'assets/tsa-logo-local.png';
import TSALogoTest from 'assets/tsa-logo-test.png';
import TSALogo from 'assets/tsa-logo.png';

export default {
GHLogo,
SLLogo,
TSALogo,
SwiftSSLogo,
TSALogoLocal,
TSALogoTest,
};
Binary file added src/assets/sl-logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/tsa-logo-local.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/tsa-logo-test.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
127 changes: 123 additions & 4 deletions src/components/Drawer/Drawer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,11 @@ import React from 'react';
import { Button, useBreakpoints } from '@orfium/ictinus';
import { useHistory } from 'react-router-dom';

import GHLogo from '../../assets/gh-logo.png'
import SLLogo from '../../assets/sl-logo.png';
import SwiftSSLogo from '../../assets/swiftss-logo.png';
import TSALogoLocal from '../../assets/tsa-logo-local.png';
import TSALogoTest from '../../assets/tsa-logo-test.png';
import TSALogo from '../../assets/tsa-logo.png';
import { useIsLoggedIn } from '../../hooks/useIsLoggedIn';
import urls from '../../routing/urls';
Expand All @@ -29,6 +33,26 @@ export type Props = {
handleClick?: () => void;
};

let SiteLogo: string;
// If domain is not recognised, default to Tanzania
SiteLogo = TSALogo;
if (window.location.hostname === 'tmh-registry-client.herokuapp.com') {
// Tanzania
SiteLogo = TSALogo;
} else if (window.location.hostname === 'tmh-registry-client-gh-6a64e51863f6.herokuapp.com') {
// Ghana
SiteLogo = GHLogo;
} else if (window.location.hostname === 'tmh-registry-client-sl.herokuapp.com') {
// Sierra Leone
SiteLogo = SLLogo;
} else if (window.location.hostname === 'tmh-registry-client-staging.herokuapp.com') {
// Staging site
SiteLogo = TSALogoTest;
} else if (window.location.hostname === 'localhost') {
// Localhost
SiteLogo = TSALogoLocal;
}

const Drawer: React.FC<Props> = (props) => {
const breakpoints = useBreakpoints();
const isSmallDesktop = breakpoints.des1200 && !breakpoints.des1440;
Expand All @@ -52,6 +76,102 @@ const Drawer: React.FC<Props> = (props) => {
const isDesktop =
breakpoints.des1200 || breakpoints.des1440 || breakpoints.des1366 || breakpoints.des1920;

const getLocalisedFooterText = () => {
if (window.location.hostname === 'tmh-registry-client.herokuapp.com') {
// Tanzania
return (
<div>The Tanzania National Mesh Hernia Project is an original collaboration between SWIFTSS
and the TSA (and the forerunner of the Affordable Mesh Hernia Surgery Initiative). For
more information visit <a href="https://swiftss.org/">www.swiftss.org</a>.</div>
);
} else if (window.location.hostname === 'tmh-registry-client-gh-6a64e51863f6.herokuapp.com') {
// Ghana
return (
<div>The Affordable Mesh Hernia Surgery Initiative is a collaboration between SWIFTSS and
the Ghanaian AMHSI working group. For more information
visit <a href="https://swiftss.org/">www.swiftss.org</a>.</div>
);
} else if (window.location.hostname === 'tmh-registry-client-sl.herokuapp.com') {
// Sierra Leone
return (
<div>The Affordable Mesh Hernia Surgery Initiative is a collaboration between SWIFTSS and
the Sierra Leone AMHSI working group. For more information
visit <a href="https://swiftss.org/">www.swiftss.org</a>.</div>
);
} else if (window.location.hostname === 'tmh-registry-client-staging.herokuapp.com') {
// Staging site
return (
<div>This is the test site for the AMHSI. Please enjoy the freedom to try it out. Look
around and create some fake patients, episodes, discharges and follow ups. PLEASE DO NOT
USE ANY REAL DATA ON THIS SITE.</div>
);
} else if (window.location.hostname === 'localhost') {
// Localhost
return (
<div>The Tanzania National Mesh Hernia Project is an original collaboration between SWIFTSS
and the TSA (and the forerunner of the Affordable Mesh Hernia Surgery Initiative). For
more information visit <a href="https://swiftss.org/">www.swiftss.org</a>.</div>
)
} else {
// If domain is not recognised, default to Tanzania
return (
<div>The Tanzania National Mesh Hernia Project is an original collaboration between SWIFTSS
and the TSA (and the forerunner of the Affordable Mesh Hernia Surgery Initiative). For
more information visit <a href="https://swiftss.org/">www.swiftss.org</a>.</div>
);
}
};

const footerText= getLocalisedFooterText();

const getLocalisedHeaderText = () => {
if (window.location.hostname === 'tmh-registry-client.herokuapp.com') {
// Tanzania
return (
<div>Tanzania National<br />
Mesh Hernia Project<br />
eRegistry</div>
);
} else if (window.location.hostname === 'tmh-registry-client-gh-6a64e51863f6.herokuapp.com') {
// Ghana
return (
<div>Ghana Affordable<br />
Mesh Hernia Project<br />
eRegistry</div>
);
} else if (window.location.hostname === 'tmh-registry-client-sl.herokuapp.com') {
// Sierra Leone
return (
<div>Sierra Leone Affordable<br />
Mesh Hernia Project<br />
eRegistry</div>
);
} else if (window.location.hostname === 'tmh-registry-client-staging.herokuapp.com') {
// Staging site
return (
<div>Affordable Mesh<br />
Hernia Surgery Initiative<br />
eRegistry TEST SITE</div>
);
} else if (window.location.hostname === 'localhost') {
// Localhost
return (
<div>Tanzania National<br />
Mesh Hernia Project<br />
eRegistry</div>
)
} else {
// If domain is not recognised, default to Tanzania
return (
<div>Tanzania National<br />
Mesh Hernia Project<br />
eRegistry</div>
);
}
};

const headerText = getLocalisedHeaderText();

return (
<Container
expanded={props.expanded}
Expand Down Expand Up @@ -84,20 +204,19 @@ const Drawer: React.FC<Props> = (props) => {
</UserContainer>
)}
<HeaderText>
Tanzania <br />
NMHP Registry
{headerText}
</HeaderText>
</Header>
<Navigation handleClick={handleClick} {...props} />

<Footer>
<div style={{ display: 'flex', gap: '12px' }}>
<img width={44} src={SwiftSSLogo} />
<img width={52} src={TSALogo} />
<img width={52} src={SiteLogo} />
</div>

<FooterText>
The Tanzania Mesh Hernia Project Registry is a joint project between Swiftss and the TSA.
{footerText}
</FooterText>
</Footer>
</Container>
Expand Down
Loading