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

Update Attestation content, add logout button #17

Merged
merged 9 commits into from
Feb 5, 2025
Merged

Update Attestation content, add logout button #17

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
575653f
Update Attestation content, add logout button
Feb 3, 2025
d7d1f4e
update appsettings json file, fix custom attestation content
Feb 4, 2025
2d6ac57
remove un-intended changes
Feb 4, 2025
77ae4b4
add back default
Feb 4, 2025
888319e
put back standard attestation defaults
Feb 4, 2025
0366cfe
fix comment, variable
Feb 4, 2025
8a40299
remove commented out code
Feb 4, 2025
58b14fe
put default settings back
Feb 4, 2025
0df8632
code clean up, fix custom attestation layout
Feb 4, 2025
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
46 changes: 46 additions & 0 deletions src/ui-client/public/images/logos/orgs/nida.svg
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.
18 changes: 2 additions & 16 deletions src/ui-client/src/components/Attestation/AttestationFooter.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,22 +41,8 @@ export default class AttestationFooter extends React.PureComponent<Props,State>
return createPortal(
<div className={c}>
<div className={`${c}-text`}>
<strong>Planning to publish your results?</strong>
<span>Great! Please cite this manuscript to ensure we can continue making Leaf even better:</span>
</div>
<div className={`${c}-manuscript`}>
<a href='https://academic.oup.com/jamia/article/27/1/109/5583724' target='_'>
<span className={`${c}-manuscript-authors`}>
Nicholas J Dobbins, Clifford H Spital, Robert A Black, Jason M Morrison, Bas de Veer, Elizabeth Zampino, Robert D Harrington,
Bethene D Britt, Kari A Stephens, Adam B Wilcox, Peter Tarczy-Hornoch, Sean D Mooney.
</span>
<span className={`${c}-manuscript-title`}>
Leaf: an open-source, model-agnostic, data-driven web application for cohort discovery and translational biomedical research.
</span>
<span className={`${c}-manuscript-publisher`}>
Journal of the American Medical Informatics Association, ocz165, https://doi.org/10.1093/jamia/ocz165
</span>
</a>
<img alt="leaf-logo" className="logo" src={process.env.PUBLIC_URL + '/images/logos/apps/leaf.svg'} />
<strong>For more information about the Leaf data visualization tool, please click <a href="https://leafdocs.rit.uw.edu/" target="_blank">here</a>.</strong>
</div>
</div>,
backdrop
Expand Down
57 changes: 30 additions & 27 deletions src/ui-client/src/components/Attestation/CustomAttestationConfirmation.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import React from 'react';
import { Button, Row, Col } from 'reactstrap';
import { SessionType } from '../../models/Session'
import { AppConfig, CustomAttestationType } from '../../models/Auth';
import TextareaAutosize from 'react-textarea-autosize';

interface Props {
config?: AppConfig;
Expand All @@ -33,25 +32,45 @@ export default class CustomAttestationConfirmation extends React.PureComponent<P
const phiDisplay = isIdentified ? 'Identified' : 'Deidentified';
const showText = config && config.attestation.enabled;
const useHtml = config.attestation.type && config.attestation.type === CustomAttestationType.Html;
const skipModeSelection = config && config.attestation.skipModeSelection;
const nextButtonContainerColSize = skipModeSelection ? 12: 6;
const nextButtonContainerClass = skipModeSelection ? "" : "right";
const nextButtonText = skipModeSelection ? "Access the Data Exploration Tool" : "I Agree";

return (
<div className={confirmationClass}>
{!skipModeSelection &&
<div className={`${c}-confirmation-settings left`}>
{useDisplay} - {phiDisplay}
</div>}
<div>
{/* use custom text */}
{useHtml &&
<div className={`${c}-custom-html`} dangerouslySetInnerHTML={ {__html: config.attestation.text.join("")} }></div>
}

{!useHtml &&
<div className={`${c}-custom-text-container`}>
{config.attestation.text.map((t,i) => {
return <p key={i} className={`${c}-custom-text`}>{t}</p>;
})}
</div>
}
</div>
{showText &&
<div className={`${c}-confirmation-settings`} key='1'>
<Row className={`${c}-confirmation-settings custom`} key='1'>

<div>
<Row className={`${c}-confirmation-settings`} key='1'>
<Col md={6} className="left">
{useDisplay} - {phiDisplay}
</Col>
{!(isSubmittingAttestation || hasAttested) &&
<Col md={6} className="right">
<Col md={12}>
<Button
onClick={handleIAgreeClick}
tabIndex={-1}
className="leaf-button leaf-button-primary">
I Agree
{nextButtonText}
</Button>
{config && !config.attestation.skipModeSelection &&
{" "}
{!skipModeSelection &&
<Button
onClick={handleGoBackClick}
tabIndex={-1}
Expand All @@ -62,31 +81,15 @@ export default class CustomAttestationConfirmation extends React.PureComponent<P
</Col>
}
{(isSubmittingAttestation || hasAttested) &&
<Col md={6} className="right">
<div className={`${c}-session-load-display-container`}>
<Col md={12}>
<div className={`${c}-session-load-display-container custom`}>
<div className={`${c}-session-load-display`}>
<span>...{sessionLoadDisplay}</span>
</div>
</div>
</Col>
}
</Row>

<div>

{/* Else use custom text */}
{useHtml &&
<div className={`${c}-custom-html`} dangerouslySetInnerHTML={ {__html: config.attestation.text.join("")} }></div>
}

{!useHtml &&
<div className={`${c}-custom-text-container`}>
{config.attestation.text.map((t,i) => {
return <TextareaAutosize key={i} className={`${c}-custom-text`} defaultValue={t} readOnly={true} />;
})}
</div>
}
</div>
</div>
}
</div>
Expand Down
35 changes: 35 additions & 0 deletions src/ui-client/src/components/Header/LogoutButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
/* Copyright (c) 2022, UW Medicine Research IT, University of Washington
* Developed by Nic Dobbins and Cliff Spital, CRIO Sean Mooney
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/

import React from 'react';
import { NavItem } from 'reactstrap';
import { FaDoorOpen } from 'react-icons/fa';
import { AuthorizationState } from '../../models/state/AppState';

interface Props {
auth?: AuthorizationState;
logoutClickHandler: () => any;
}

export default class UserButton extends React.PureComponent<Props> {
private className = 'header';

public render() {
const c = this.className;
const { auth, logoutClickHandler} = this.props;
const authLogoutEnabled = auth && auth.config && auth.config.authentication.logout.enabled;
if (!authLogoutEnabled) return null;
return (
<NavItem className={`${c}-myleaf ${c}-item-dropdown ${c}-item-hover-dark`}>
<div className={`${c}-myleaf-icon-container`} onClick={logoutClickHandler}>
<FaDoorOpen className="header-options-icon header-myleaf-icon" />
<span className="header-options-text">Log Out</span>
</div>
</NavItem>
);
}
}
8 changes: 1 addition & 7 deletions src/ui-client/src/components/Header/UserButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
import React from 'react';
import { NavItem } from 'reactstrap';
import { FiUser, FiUserCheck, FiShield, FiGlobe, FiAlertOctagon, FiUsers, FiHelpCircle } from 'react-icons/fi';
import { FaChevronDown, FaStar, FaDoorOpen } from 'react-icons/fa';
import { FaChevronDown, FaStar } from 'react-icons/fa';
import { UserContext } from '../../models/Auth';
import ImportState from '../../models/state/Import';
import { MyLeafTabType } from '../../models/state/GeneralUiState';
Expand Down Expand Up @@ -122,12 +122,6 @@ export default class UserButton extends React.PureComponent<Props> {

<div className={`${c}-option-divider`} />

{auth && auth.config && auth.config.authentication.logout.enabled &&
<div className={`${c}-option ${c}-option-logout`} onClick={logoutClickHandler}>
<FaDoorOpen className="myleaf-menu-icon myleaf-menu-icon-logout" />
<span>Log Out</span>
</div>
}
</div>
</div>
</NavItem>
Expand Down
Loading