60 lines
1.8 KiB
JavaScript
60 lines
1.8 KiB
JavaScript
![]() |
import React, { useState } from "react";
|
||
|
import PropTypes from "prop-types";
|
||
|
import Pct from "../PatternOptionPercentage";
|
||
|
import Deg from "../PatternOptionDegree";
|
||
|
import Mm from "../PatternOptionMillimeter";
|
||
|
import Bool from "../PatternOptionBool";
|
||
|
import OptionGroup from "../OptionGroup";
|
||
|
import { optionType, defaultGist, gistDefaults } from "../utils";
|
||
|
import { patternInfo, patternList } from "@freesewing/patterns";
|
||
|
import { FormattedMessage } from "react-intl";
|
||
|
|
||
|
const GistConfigurator = props => {
|
||
|
const [gist, setGist] = useState(props.gist || defaultGist);
|
||
|
|
||
|
const update = (type, name, value) => {
|
||
|
console.log("updating", type, name, value);
|
||
|
};
|
||
|
|
||
|
let pattern = patternInfo[props.pattern];
|
||
|
let dflts = gistDefaults(pattern.config, gist);
|
||
|
|
||
|
return (
|
||
|
<div className="gist-config">
|
||
|
<div className="gist-options">
|
||
|
<h2>
|
||
|
<FormattedMessage id="app.patternOptions" />
|
||
|
</h2>
|
||
|
{Object.keys(pattern.optionGroups).map(group => (
|
||
|
<React.Fragment key={group}>
|
||
|
<h3 key={group + "-title"}>
|
||
|
<FormattedMessage id={"optiongroups." + group} />
|
||
|
</h3>
|
||
|
<OptionGroup
|
||
|
key={group + "-group"}
|
||
|
units={props.units}
|
||
|
pattern={pattern}
|
||
|
dflts={dflts}
|
||
|
options={pattern.optionGroups[group]}
|
||
|
updateValue={update}
|
||
|
triggerAction={props.triggerAction}
|
||
|
/>
|
||
|
</React.Fragment>
|
||
|
))}
|
||
|
<h2>
|
||
|
<FormattedMessage id="app.draftSettings" />
|
||
|
</h2>
|
||
|
</div>
|
||
|
</div>
|
||
|
);
|
||
|
};
|
||
|
|
||
|
GistConfigurator.propTypes = {
|
||
|
pattern: PropTypes.oneOf(patternList),
|
||
|
units: PropTypes.oneOf(["metric", "imperial"]).isRequired
|
||
|
};
|
||
|
|
||
|
GistConfigurator.defaultProps = {};
|
||
|
|
||
|
export default GistConfigurator;
|