a_adli/colouring-montreal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Button style unification for user-survey questions

Browse Source
This commit is contained in:
Mateusz Konieczny 2023-02-15 17:14:51 +01:00
parent fc2cc07a1c
commit fa9e81d281
2 changed files with 30 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
app/src/frontend/building/data-components/logical-data-entry/logical-data-entry.tsx
View File

@ -145,3 +145,31 @@ export const LogicalDataEntryYesOnly: React.FC<LogicalDataEntryProps> = (props)
</>
);
};
export const LogicalDataEntryYesOnlyWithExplanation: React.FC<LogicalDataEntryProps> = (props) => {
function handleValueChange(e: React.ChangeEvent<HTMLInputElement>) {
props.onChange?.(props.slug, e.target.checked);
}
const isDisabled = props.mode === 'view' || props.disabled;
return (
<>
<DataTitleCopyable
slug={props.slug}
title={props.title}
tooltip={props.tooltip}
disabled={props.disabled || props.value == undefined}
copy={props.copy}
/>
<label className="form-check-label">
<input className="form-check-input" type="checkbox"
name={props.slug}
checked={props.value === true}
disabled={isDisabled || props.disallowTrue}
onChange={handleValueChange}
/> Yes (tick to add or remove your edit)
</label>
</>
);
};

4
app/src/frontend/building/data-containers/community.tsx
View File

@ -8,7 +8,7 @@ import { DataEntryGroup } from '../data-components/data-entry-group';
import { CategoryViewProps } from './category-view-props';
import InfoBox from '../../components/info-box';
import { LogicalDataEntry, LogicalDataEntryYesOnly } from '../data-components/logical-data-entry/logical-data-entry';
import { LogicalDataEntry, LogicalDataEntryYesOnlyWithExplanation } from '../data-components/logical-data-entry/logical-data-entry';
import { buildingUserFields, dataFields } from '../../config/data-fields-config';
import './community.css';
@ -66,7 +66,7 @@ const CommunityView: React.FunctionComponent<CategoryViewProps> = (props) => {
: <></>}
*/
}
<LogicalDataEntryYesOnly
<LogicalDataEntryYesOnlyWithExplanation
slug='community_type_worth_keeping'
title={buildingUserFields.community_type_worth_keeping.title}