helsenorge / refero Goto Github PK
View Code? Open in Web Editor NEWFHIR Questionnaire Form Filler React Component
License: MIT License
FHIR Questionnaire Form Filler React Component
License: MIT License
Hello,
I noticed that when I take ReferoContainer in use it will loads styles globally all around the application and there are css that is targeting all the checkboxes. Could this checkbox be styled so that it would not target all the checkboxes? These style comes from @helsenorge/form library (@helsenorge/form/components/checkbox/styles.scss) Below is the styles that are loaded globally.
input[type=checkbox] {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
input[type=checkbox] + label {
cursor: pointer;
display: block;
font-size: 18px;
font-weight: 400;
margin: 0;
word-break: break-word;
hyphens: auto;
hyphens: auto;
hyphens: auto;
}
The issue primarily revolves around the DateYear component. Specifically, during the generation of the preview response, particularly when the pdf flag is set to true, an anomaly is encountered.
Detailed Description:
Upon inspection, it was observed that within the preview response generation, the value retrieval mechanism relies on the getPDFValue function. Below is a snippet exemplifying its integration:
return React.createElement(textview_1.default, {
id: props.id,
item: props.item,
value: getPDFValue(),
onRenderMarkdown: props.onRenderMarkdown,
helpButton: props.helpButton,
helpElement: props.helpElement
}, props.children);
The getPDFValue function internally invokes the getYear function to fetch the relevant year data. However, a critical issue arises within the getYear function. Despite the conditional check for props.answer being an array, it invariably evaluates to false, leading to an undefined outcome. Consequently, the final response defaults to the 'not found text'.
Below is a segment illustrating the problematic section within the getYear function:
const getYear = () => {
if (Array.isArray(props.answer)) {
return props.answer.map(m => {
return (createDateFromYear(props.item, m))?.getFullYear();
});
}
};
Proposed Solution:
To address this issue, I have devised a solution that involves refining the getYear and getPDFValue functions. The modifications aim to enhance the logic flow and ensure accurate retrieval and presentation of the year data.
Here is a synopsis of the adjustments made:
const getYear = (): (number | undefined)[] | undefined | string | number => {
if (Array.isArray(props.answer)) {
return props.answer.map((m: QuestionnaireResponseItemAnswer) => createDateFromYear(props.item, m)?.getFullYear());
}
if (props.answer?.valueDate) {
return props.answer?.valueDate
}
return answerState;
};
const getPDFValue = (): string | number => {
const ikkeBesvartText = props.resources?.ikkeBesvart || '';
const year = getYear();
if (Array.isArray(year)) {
return year
?.map(m => m?.toString())
.join(', ') || ikkeBesvartText;
}
return year || ikkeBesvartText;
};
The outlined adjustments ensure robust handling of diverse data scenarios, thereby mitigating the issue encountered during the preview response generation.
I trust that this information provides valuable insight into the matter at hand. Please feel free to reach out should further clarification or assistance be required.
Thank you for your attention to this matter.
Best regards,
Astghik
Hello,
I noticed that the refero library and its dependencies are quite big. Those are total of 7.5 MB in the bundle file. It can take a long time to load the application with refero library if you have a poor internet connection. The fhir.js file (@helsenorge\refero\types\fhir.js) that contains the FHIR types takes up most of the space in the bundle (6.36MB). Is there any way that you could optimize the size of this library? Are all the types for example necessary for rendering FHIR Questionnaire?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.