{"version":3,"file":"InfoBox.BoSMDIPt.js","sources":["../../src/components/icons/purposed/HelperIcon/components/InfoBox.jsx"],"sourcesContent":["import { Component, createRef } from \"react\";\r\nimport {\r\n  Grid,\r\n  IconButton,\r\n  TextField,\r\n  Tooltip,\r\n  Typography,\r\n} from \"@mui/material\";\r\nimport PropTypes from \"prop-types\";\r\n\r\nimport ProgressCirc from \"src/components/layout/Progress/ProgressCirc\";\r\nimport StepButtons from \"src/components/buttons/StepButtons/StepButtons\";\r\nimport { EditIcon, SaveIcon } from \"src/components/icons/ActionIcons\";\r\nimport {\r\n  cache_clear,\r\n  cache_read,\r\n  cache_write,\r\n  helps_cacheName,\r\n} from \"src/components/js/CacheFunctions\";\r\n\r\nexport default class InfoBox extends Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.otsikkoRef = createRef();\r\n    this.htmlTextRef = createRef();\r\n    this.state = {\r\n      items: [],\r\n      title: \"haetaan...\",\r\n      text: \"\",\r\n      rev: 0,\r\n      isLoaded: false,\r\n    };\r\n  }\r\n  componentDidMount() {\r\n    try {\r\n      this.getData();\r\n    } catch (error) {\r\n      console.log(error);\r\n    }\r\n  }\r\n\r\n  getData() {\r\n    const url =\r\n      import.meta.env.VITE_SERVER_URL + \"/api/helps/get/\" + this.props.helpId;\r\n    try {\r\n      const c = cache_read(helps_cacheName, url);\r\n      if (c) {\r\n        this.processJson(c);\r\n        return;\r\n      }\r\n\r\n      fetch(url)\r\n        .then((res) => res.json())\r\n        .then((json) => {\r\n          cache_write(helps_cacheName, url, json, 3600);\r\n          this.processJson(json);\r\n        })\r\n        .catch((error) => {\r\n          throw error;\r\n        });\r\n    } catch (error) {\r\n      console.log(error);\r\n    }\r\n  }\r\n\r\n  processJson(json) {\r\n    if (json.length > 0)\r\n      this.setState({\r\n        title: json[0].title,\r\n        htmlText: json[0].htmltext,\r\n        img: json[0].img,\r\n        rev: json[0].rev,\r\n        shortText: json[0].shorttext,\r\n      });\r\n    else\r\n      this.setState({\r\n        title: \"Syötä otsikko\",\r\n      });\r\n\r\n    this.setState({\r\n      isLoaded: true,\r\n      editOtsikko: false,\r\n      editText: false,\r\n    });\r\n    this.props.onShowSuljeButtonChange(true);\r\n  }\r\n\r\n  render() {\r\n    const allowEdit = this.props.allowEdit;\r\n    const onEditTitleButtonClick = (value) => {\r\n      this.setState({ editOtsikko: value });\r\n      this.props.onShowSuljeButtonChange(false);\r\n    };\r\n    const onEditHtmlTextButtonClick = (value) => {\r\n      this.setState({ editText: value });\r\n      this.props.onShowSuljeButtonChange(false);\r\n    };\r\n    const onSaveTitleButtonClick = () => {\r\n      cache_clear(helps_cacheName);\r\n      const otsikko = this.otsikkoRef.current.value;\r\n      this.setState({\r\n        title: otsikko,\r\n        editOtsikko: false,\r\n      });\r\n      this.props.onShowSuljeButtonChange(true);\r\n      const requestOptions = {\r\n        method: \"PUT\",\r\n        headers: {\r\n          \"Content-Type\": \"application/json\",\r\n        },\r\n        body: JSON.stringify({\r\n          helpId: this.props.helpId,\r\n          img: this.state.img,\r\n          title: otsikko,\r\n          shorttext: this.state.shortText,\r\n          htmltext: this.state.htmlText,\r\n        }),\r\n      };\r\n      fetch(\r\n        import.meta.env.VITE_SERVER_URL + \"/api/helps/update\",\r\n        requestOptions\r\n      ).then((response) => response.json());\r\n    };\r\n    const onSaveHtmlTextButtonClick = () => {\r\n      cache_clear(helps_cacheName);\r\n      const htmlTeksti = this.htmlTextRef.current.value;\r\n      this.setState({\r\n        htmlText: htmlTeksti,\r\n        editText: false,\r\n      });\r\n      this.props.onShowSuljeButtonChange(true);\r\n      const requestOptions = {\r\n        method: \"PUT\",\r\n        headers: {\r\n          \"Content-Type\": \"application/json\",\r\n        },\r\n        body: JSON.stringify({\r\n          helpId: this.props.helpId,\r\n          img: this.state.img,\r\n          title: this.state.title,\r\n          shorttext: this.state.shortText,\r\n          htmltext: htmlTeksti,\r\n        }),\r\n      };\r\n      fetch(\r\n        import.meta.env.VITE_SERVER_URL + \"/api/helps/update\",\r\n        requestOptions\r\n      ).then((response) => response.json());\r\n    };\r\n\r\n    return (\r\n      <>\r\n        <Grid container sx={{ width: \"100%\" }}>\r\n          <Grid size={{ xs: 11 }}>\r\n            {!this.state.editOtsikko ? (\r\n              <>\r\n                {this.state.isLoaded ? (\r\n                  <Typography\r\n                    //className={classes.div2}\r\n                    id=\"helperOtsikko\"\r\n                    variant=\"h6\"\r\n                    color=\"primary\"\r\n                    component=\"span\"\r\n                    sx={{ whiteSpace: \"pre-line\" }}\r\n                    dangerouslySetInnerHTML={{ __html: this.state.title }}\r\n                  ></Typography>\r\n                ) : (\r\n                  <ProgressCirc isLoading={!this.state.isLoaded} />\r\n                )}\r\n              </>\r\n            ) : (\r\n              <>\r\n                <TextField\r\n                  fullWidth\r\n                  id=\"editOtsikkoTxt\"\r\n                  label=\"Otsikko\"\r\n                  defaultValue={this.state.title}\r\n                  inputRef={this.otsikkoRef}\r\n                  onKeyDown={(e) => {\r\n                    if (e.key === \"Enter\") {\r\n                      onSaveTitleButtonClick();\r\n                    }\r\n                    if (e.key === \"Escape\") {\r\n                      this.getData();\r\n                    }\r\n                  }}\r\n                />\r\n              </>\r\n            )}\r\n          </Grid>\r\n          <Grid size={{ xs: 1 }}>\r\n            {allowEdit ? (\r\n              <div className=\"noPrint\">\r\n                {!this.state.editOtsikko ? (\r\n                  <IconButton\r\n                    onClick={() =>\r\n                      onEditTitleButtonClick(!this.state.editOtsikko)\r\n                    }\r\n                    aria-label=\"Muokkaa\"\r\n                  >\r\n                    <EditIcon />\r\n                  </IconButton>\r\n                ) : (\r\n                  <IconButton\r\n                    onClick={() => onSaveTitleButtonClick()}\r\n                    aria-label=\"Tallenna\"\r\n                  >\r\n                    <SaveIcon />\r\n                  </IconButton>\r\n                )}\r\n              </div>\r\n            ) : (\r\n              \"\"\r\n            )}\r\n          </Grid>\r\n        </Grid>\r\n        <Grid container sx={{ width: \"100%\" }}>\r\n          <Grid size={{ xs: 11 }}>\r\n            {!this.state.editText ? (\r\n              <>\r\n                <Typography color=\"primary\" component=\"div\">\r\n                  <span\r\n                    style={{ whiteSpace: \"pre-line\" }}\r\n                    dangerouslySetInnerHTML={{ __html: this.state.htmlText }}\r\n                  />\r\n                </Typography>\r\n              </>\r\n            ) : (\r\n              <TextField\r\n                fullWidth\r\n                id=\"editSeliteTxt\"\r\n                label=\"Selite\"\r\n                multiline\r\n                maxRows={8}\r\n                defaultValue={this.state.htmlText}\r\n                inputRef={this.htmlTextRef}\r\n              />\r\n            )}\r\n          </Grid>\r\n          <Grid size={{ xs: 1 }}>\r\n            {allowEdit ? (\r\n              <>\r\n                {!this.state.editText ? (\r\n                  <Tooltip title={this.props.helpId} disableInteractive>\r\n                    <IconButton\r\n                      onClick={() =>\r\n                        onEditHtmlTextButtonClick(!this.state.editText)\r\n                      }\r\n                      aria-label=\"Muokkaa\"\r\n                    >\r\n                      <EditIcon color=\"primary\" />\r\n                    </IconButton>\r\n                  </Tooltip>\r\n                ) : (\r\n                  <IconButton\r\n                    onClick={() => onSaveHtmlTextButtonClick()}\r\n                    aria-label=\"Tallenna\"\r\n                  >\r\n                    <SaveIcon />\r\n                  </IconButton>\r\n                )}\r\n              </>\r\n            ) : (\r\n              \"\"\r\n            )}\r\n          </Grid>\r\n        </Grid>\r\n        {(this.state.editOtsikko || this.state.editText) && (\r\n          <>\r\n            <StepButtons\r\n              onCancelKlik={() => this.getData()}\r\n              onSaveKlik={() => {\r\n                if (this.state.editText) onSaveHtmlTextButtonClick();\r\n                if (this.state.editOtsikko) onSaveTitleButtonClick();\r\n              }}\r\n            />\r\n          </>\r\n        )}\r\n      </>\r\n    );\r\n  }\r\n}\r\n\r\nInfoBox.propTypes = {\r\n  allowEdit: PropTypes.bool,\r\n  onShowSuljeButtonChange: PropTypes.func,\r\n  helpId: PropTypes.string,\r\n};\r\n"],"names":["InfoBox","Component","constructor","props","super","otsikkoRef","createRef","htmlTextRef","this","state","items","title","text","rev","isLoaded","componentDidMount","getData","error","console","log","url","import","helpId","c","cache_read","helps_cacheName","processJson","then","res","json","catch","length","setState","htmlText","htmltext","img","shortText","shorttext","editOtsikko","editText","onShowSuljeButtonChange","render","allowEdit","onEditTitleButtonClick","value","onEditHtmlTextButtonClick","onSaveTitleButtonClick","cache_clear","otsikko","current","requestOptions","method","headers","body","JSON","stringify","response","onSaveHtmlTextButtonClick","htmlTeksti","jsxs","Fragment","children","Grid","container","sx","width","jsx","size","xs","TextField","fullWidth","id","label","defaultValue","inputRef","onKeyDown","e","key","Typography","variant","color","component","whiteSpace","dangerouslySetInnerHTML","__html","ProgressCirc","isLoading","className","IconButton","onClick","SaveIcon","EditIcon","multiline","maxRows","style","Tooltip","disableInteractive","StepButtons","onCancelKlik","onSaveKlik","propTypes","PropTypes","bool","func","string"],"mappings":"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"}