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

Add overridable tags #287

Merged
merged 9 commits into from
Apr 8, 2024
Merged

Add overridable tags #287

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
8db39eb
Add overridable tags
SarahW91 Dec 7, 2023
dd898a2
Adjust overridable ids
SarahW91 Dec 7, 2023
3dd61ea
Correct overridable tag containing multiple children
SarahW91 Dec 11, 2023
80a1591
Rename Overridable IDs.
SarahW91 Apr 3, 2024
908e329
Rename Overridable IDs again.
SarahW91 Apr 3, 2024
55f16c5
Merge branch 'inveniosoftware:master' into add-overridable-tags
SarahW91 Apr 3, 2024
37e7846
Update invenio_vocabularies/assets/semantic-ui/js/invenio_vocabularie…
SarahW91 Apr 4, 2024
9c3dba9
Formatting with prettier.
SarahW91 Apr 4, 2024
8093de8
Add fieldPath to Overridable tags.
SarahW91 Apr 5, 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
127 changes: 75 additions & 52 deletions ...s/assets/semantic-ui/js/invenio_vocabularies/src/contrib/forms/Funding/CustomAwardForm.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ import { TextField, RemoteSelectField } from "react-invenio-forms";
import { i18next } from "@translations/invenio_rdm_records/i18next";
import _isEmpty from "lodash/isEmpty";

import Overridable from "react-overridable";

function CustomAwardForm({ deserializeFunder, selectedFunding }) {
function deserializeFunderToDropdown(funderItem) {
let funderName = null;
Expand Down Expand Up @@ -53,64 +55,85 @@ function CustomAwardForm({ deserializeFunder, selectedFunding }) {

return (
<Form>
<RemoteSelectField
<Overridable
id="InvenioVocabularies.CustomAwardForm.RemoteSelectField.Container"
fieldPath="selectedFunding.funder.id"
suggestionAPIUrl="/api/funders"
suggestionAPIHeaders={{
Accept: "application/vnd.inveniordm.v1+json",
}}
placeholder={i18next.t("Search for a funder by name")}
serializeSuggestions={(funders) => {
return funders.map((funder) =>
deserializeFunderToDropdown(deserializeFunder(funder))
);
}}
searchInput={{
autoFocus: _isEmpty(selectedFunding),
}}
label={i18next.t("Funder")}
noQueryMessage={i18next.t("Search for funder...")}
clearable
allowAdditions={false}
multiple={false}
selectOnBlur={false}
selectOnNavigation={false}
required
search={(options) => options}
isFocused
onValueChange={({ formikProps }, selectedFundersArray) => {
if (selectedFundersArray.length === 1) {
const selectedFunder = selectedFundersArray[0];
if (selectedFunder) {
const deserializedFunder = serializeFunderFromDropdown(selectedFunder);
formikProps.form.setFieldValue(
"selectedFunding.funder",
deserializedFunder
);
>
<RemoteSelectField
fieldPath="selectedFunding.funder.id"
suggestionAPIUrl="/api/funders"
suggestionAPIHeaders={{
Accept: "application/vnd.inveniordm.v1+json",
}}
placeholder={i18next.t("Search for a funder by name")}
serializeSuggestions={(funders) => {
return funders.map((funder) =>
deserializeFunderToDropdown(deserializeFunder(funder))
);
}}
searchInput={{
autoFocus: _isEmpty(selectedFunding),
}}
label={i18next.t("Funder")}
noQueryMessage={i18next.t("Search for funder...")}
clearable
allowAdditions={false}
multiple={false}
selectOnBlur={false}
selectOnNavigation={false}
required
search={(options) => options}
isFocused
onValueChange={({ formikProps }, selectedFundersArray) => {
if (selectedFundersArray.length === 1) {
const selectedFunder = selectedFundersArray[0];
if (selectedFunder) {
const deserializedFunder = serializeFunderFromDropdown(selectedFunder);
formikProps.form.setFieldValue(
"selectedFunding.funder",
deserializedFunder
);
}
}
}
}}
/>

<Header as="h3" size="small">
{i18next.t("Award information")} ({i18next.t("optional")})
</Header>
}}
/>
</Overridable>
<Overridable id="InvenioVocabularies.CustomAwardForm.AwardInformationHeader.Container">
<Header as="h3" size="small">
{i18next.t("Award information")} ({i18next.t("optional")})
</Header>
</Overridable>
<Form.Group widths="equal">
<TextField
label={i18next.t("Number")}
placeholder={i18next.t("Award number")}
<Overridable
id="InvenioVocabularies.CustomAwardForm.AwardNumberTextField.Container"
fieldPath="selectedFunding.award.number"
/>
<TextField
label={i18next.t("Title")}
placeholder={i18next.t("Award Title")}
>
<TextField
label={i18next.t("Number")}
placeholder={i18next.t("Award number")}
fieldPath="selectedFunding.award.number"
/>
</Overridable>
<Overridable
id="InvenioVocabularies.CustomAwardForm.AwardTitleTextField.Container"
fieldPath="selectedFunding.award.title"
/>
<TextField
label={i18next.t("URL")}
placeholder={i18next.t("Award URL")}
>
<TextField
label={i18next.t("Title")}
placeholder={i18next.t("Award Title")}
fieldPath="selectedFunding.award.title"
/>
</Overridable>
<Overridable
id="InvenioVocabularies.CustomAwardForm.AwardUrlTextField.Container"
fieldPath="selectedFunding.award.url"
/>
>
<TextField
label={i18next.t("URL")}
placeholder={i18next.t("Award URL")}
fieldPath="selectedFunding.award.url"
/>
</Overridable>
</Form.Group>
</Form>
);
Expand Down
88 changes: 48 additions & 40 deletions ...ries/assets/semantic-ui/js/invenio_vocabularies/src/contrib/forms/Funding/FundingField.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,8 @@ import FundingModal from "./FundingModal";

import { i18next } from "@translations/invenio_rdm_records/i18next";

import Overridable from "react-overridable";

function FundingFieldForm(props) {
const {
label,
Expand Down Expand Up @@ -108,46 +110,52 @@ function FundingFieldForm(props) {
);
})}
</List>
<FundingModal
searchConfig={searchConfig}
trigger={
<Button
type="button"
key="custom"
icon
labelPosition="left"
className="mb-5"
>
<Icon name="add" />
{i18next.t("Add award")}
</Button>
}
onAwardChange={(selectedFunding) => {
formikArrayPush(selectedFunding);
}}
mode="standard"
action="add"
deserializeAward={deserializeAward}
deserializeFunder={deserializeFunder}
computeFundingContents={computeFundingContents}
/>
<FundingModal
searchConfig={searchConfig}
trigger={
<Button type="button" key="custom" icon labelPosition="left">
<Icon name="add" />
{i18next.t("Add custom")}
</Button>
}
onAwardChange={(selectedFunding) => {
formikArrayPush(selectedFunding);
}}
mode="custom"
action="add"
deserializeAward={deserializeAward}
deserializeFunder={deserializeFunder}
computeFundingContents={computeFundingContents}
/>

<Overridable id="InvenioVocabularies.FundingField.AddAwardFundingModal.Container">
<FundingModal
searchConfig={searchConfig}
trigger={
<Button
type="button"
key="custom"
icon
labelPosition="left"
className="mb-5"
>
<Icon name="add" />
{i18next.t("Add award")}
</Button>
}
onAwardChange={(selectedFunding) => {
formikArrayPush(selectedFunding);
}}
mode="standard"
action="add"
deserializeAward={deserializeAward}
deserializeFunder={deserializeFunder}
computeFundingContents={computeFundingContents}
/>
</Overridable>

<Overridable id="InvenioVocabularies.FundingField.AddCustomFundingModal.Container">
<FundingModal
searchConfig={searchConfig}
trigger={
<Button type="button" key="custom" icon labelPosition="left">
<Icon name="add" />
{i18next.t("Add custom")}
</Button>
}
onAwardChange={(selectedFunding) => {
formikArrayPush(selectedFunding);
}}
mode="custom"
action="add"
deserializeAward={deserializeAward}
deserializeFunder={deserializeFunder}
computeFundingContents={computeFundingContents}
/>
</Overridable>
</Form.Field>
</DndProvider>
);
Expand Down