@iobroker/adapter-react-v5 4.10.1 → 4.10.4

package/Components/FileViewer.js

@@ -1,350 +1,277 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
 });
-exports["default"] = exports.EXTENSIONS = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
-var _styles = require("@mui/styles");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _material = require("@mui/material");
-var _fa = require("react-icons/fa");
-var _iconsMaterial = require("@mui/icons-material");
-var _IconNoIcon = _interopRequireDefault(require("../icons/IconNoIcon"));
-var _withWidth = _interopRequireDefault(require("./withWidth"));
-var _Utils = _interopRequireDefault(require("./Utils"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
-function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } // File viewer in adapter-react does not support write
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EXTENSIONS = void 0;
+// File viewer in adapter-react does not support write
 // import { Buffer } from 'buffer';
+const react_1 = __importStar(require("react"));
+const styles_1 = require("@mui/styles");
+const material_1 = require("@mui/material");
 // Icons
+const fa_1 = require("react-icons/fa");
+const icons_material_1 = require("@mui/icons-material");
+const IconNoIcon_1 = __importDefault(require("../icons/IconNoIcon"));
+const withWidth_1 = __importDefault(require("./withWidth"));
+const Utils_1 = __importDefault(require("./Utils"));
 // File viewer in adapter-react does not use ace editor
 // import Editor from './Editor';
-
-var styles = function styles() {
-  return {
+const styles = {
     dialog: {
-      height: '100%'
+        height: '100%',
     },
     paper: {
-      height: 'calc(100% - 64px)'
+        height: 'calc(100% - 64px)',
     },
     content: {
-      textAlign: 'center'
+        textAlign: 'center',
     },
     textarea: {
-      width: '100%',
-      height: '100%'
+        width: '100%',
+        height: '100%',
     },
     img: {
-      width: 'auto',
-      height: 'calc(100% - 5px)',
-      objectFit: 'contain'
+        width: 'auto',
+        height: 'calc(100% - 5px)',
+        objectFit: 'contain',
     },
     dialogTitle: {
-      justifyContent: 'space-between',
-      display: 'flex'
-    }
-  };
+        justifyContent: 'space-between',
+        display: 'flex',
+    },
 };
-var EXTENSIONS = exports.EXTENSIONS = {
-  images: ['png', 'jpg', 'svg', 'jpeg', 'bmp', 'gif', 'apng', 'avif', 'webp'],
-  code: ['js', 'json', 'json5', 'md'],
-  txt: ['log', 'txt', 'html', 'css', 'xml'],
-  audio: ['mp3', 'wav', 'ogg', 'acc'],
-  video: ['mp4', 'mov', 'avi']
+exports.EXTENSIONS = {
+    images: ['png', 'jpg', 'svg', 'jpeg', 'bmp', 'gif', 'apng', 'avif', 'webp'],
+    code: ['js', 'json', 'json5', 'md'],
+    txt: ['log', 'txt', 'html', 'css', 'xml'],
+    audio: ['mp3', 'wav', 'ogg', 'acc'],
+    video: ['mp4', 'mov', 'avi'],
 };
 function bufferToBase64(buffer, isFull) {
-  var binary = '';
-  var bytes = new Uint8Array(buffer);
-  var len = bytes.byteLength;
-  for (var i = 0; i < len && (isFull || i < 50); i++) {
-    binary += String.fromCharCode(bytes[i]);
-  }
-  return window.btoa(binary);
+    let binary = '';
+    const bytes = new Uint8Array(buffer);
+    const len = bytes.byteLength;
+    for (let i = 0; i < len && (isFull || i < 50); i++) {
+        binary += String.fromCharCode(bytes[i]);
+    }
+    return window.btoa(binary);
 }
-
-/**
- * @typedef {object} FileViewerProps
- * @property {string} [key] The key to identify this component.
- * @property {import('../types').Translator} t Translation function
- * @property {ioBroker.Languages} [lang] The selected language.
- * @property {boolean} [expertMode] Is expert mode enabled? (default: false)
- * @property {() => void} onClose Callback when the viewer is closed.
- * @property {string} href The URL to the file to be displayed.
- *
- * @extends {React.Component<FileViewerProps>}
- */
-var FileViewer = /*#__PURE__*/function (_Component) {
-  (0, _inherits2["default"])(FileViewer, _Component);
-  /**
-   * @param {Readonly<FileViewerProps>} props
-   */
-  function FileViewer(props) {
-    var _this;
-    (0, _classCallCheck2["default"])(this, FileViewer);
-    _this = _callSuper(this, FileViewer, [props]);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onFileChanged", function (id, fileName, size) {
-      if (!_this.state.changed) {
-        _this.timeout && clearTimeout(_this.timeout);
-        _this.timeout = setTimeout(function () {
-          _this.timeout = null;
-          if (size === null) {
-            window.alert('Show file was deleted!');
-          } else if (_this.state.text !== null || _this.state.code !== null) {
-            _this.readFile();
-          } else {
-            _this.setState({
-              forceUpdate: Date.now()
-            });
-          }
-        }, 300);
-      }
-    });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "writeFile64", function () {
-      /*
-      // File viewer in adapter-react does not support write
-      const parts = this.props.href.split('/');
-      const data = this.state.editingValue;
-      parts.splice(0, 2);
-      const adapter = parts[0];
-      const name = parts.splice(1).join('/');
-      this.props.socket.writeFile64(adapter, name, Buffer.from(data).toString('base64'))
-          .then(() => this.props.onClose())
-          .catch(e => window.alert(`Cannot write file: ${e}`));
-      */
-    });
-    var ext = _Utils["default"].getFileExtension(_this.props.href);
-    _this.state = {
-      text: null,
-      code: null,
-      ext: ext,
-      // File viewer in adapter-react does not support write
-      editing: /* !!this.props.formatEditFile || */false,
-      editingValue: null,
-      copyPossible: EXTENSIONS.code.includes(ext) || EXTENSIONS.txt.includes(ext),
-      forceUpdate: Date.now(),
-      changed: false,
-      imgError: false
-    };
-    return _this;
-  }
-  (0, _createClass2["default"])(FileViewer, [{
-    key: "readFile",
-    value: function readFile() {
-      var _this2 = this;
-      if (this.props.href) {
-        var parts = this.props.href.split('/');
-        parts.splice(0, 2);
-        var adapter = parts[0];
-        var name = parts.splice(1).join('/');
-        this.props.socket.readFile(adapter, name).then(function (data) {
-          if (data.file !== undefined) {
-            data = data.file;
-          }
-          var newState = {
-            copyPossible: _this2.state.copyPossible,
-            ext: _this2.state.ext
-          };
-          // try to detect valid extension
-          if (data.type === 'Buffer') {
-            if (name.toLowerCase().endsWith('.json5')) {
-              newState.ext = 'json5';
-              newState.copyPossible = true;
-              try {
-                data = atob(bufferToBase64(data.data, true));
-              } catch (e) {
-                console.error('Cannot convert base64 to string');
-                data = '';
-              }
-            } else {
-              var ext = _Utils["default"].detectMimeType(bufferToBase64(data.data));
-              if (ext) {
-                newState.ext = ext;
-                newState.copyPossible = EXTENSIONS.code.includes(ext) || EXTENSIONS.txt.includes(ext);
-              }
+class FileViewer extends react_1.Component {
+    constructor(props) {
+        super(props);
+        this.timeout = null;
+        this.onFileChanged = (id, fileName, size) => {
+            if (!this.state.changed) {
+                this.timeout && clearTimeout(this.timeout);
+                this.timeout = setTimeout(() => {
+                    this.timeout = null;
+                    if (size === null) {
+                        window.alert('Show file was deleted!');
+                    }
+                    else if (this.state.text !== null || this.state.code !== null) {
+                        this.readFile();
+                    }
+                    else {
+                        this.setState({ forceUpdate: Date.now() });
+                    }
+                }, 300);
             }
-          }
-          if (newState.copyPossible) {
-            if (EXTENSIONS.txt.includes(newState.ext)) {
-              newState.text = data;
-              newState.editingValue = data;
-            } else if (EXTENSIONS.code.includes(newState.ext)) {
-              newState.code = data;
-              newState.editingValue = data;
-            }
-          }
-          _this2.setState(newState);
-        })["catch"](function (e) {
-          return window.alert("Cannot read file: ".concat(e));
-        });
-      }
+        };
+        this.writeFile64 = () => {
+            /*
+            // File viewer in adapter-react does not support write
+            const parts = this.props.href.split('/');
+            const data = this.state.editingValue;
+            parts.splice(0, 2);
+            const adapter = parts[0];
+            const name = parts.splice(1).join('/');
+            this.props.socket.writeFile64(adapter, name, Buffer.from(data).toString('base64'))
+                .then(() => this.props.onClose())
+                .catch(e => window.alert(`Cannot write file: ${e}`));
+            */
+        };
+        const ext = Utils_1.default.getFileExtension(props.href);
+        this.state = {
+            text: null,
+            code: null,
+            ext,
+            // File viewer in adapter-react does not support write
+            editing: /* !!this.props.formatEditFile || */ false,
+            editingValue: null,
+            copyPossible: !!ext && (exports.EXTENSIONS.code.includes(ext) || exports.EXTENSIONS.txt.includes(ext)),
+            forceUpdate: Date.now(),
+            changed: false,
+            imgError: false,
+        };
     }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.readFile();
-      var parts = this.props.href.split('/');
-      parts.splice(0, 2);
-      var adapter = parts[0];
-      var name = parts.splice(1).join('/');
-      this.props.supportSubscribes && this.props.socket.subscribeFiles(adapter, name, this.onFileChanged);
+    readFile() {
+        if (this.props.href) {
+            const parts = this.props.href.split('/');
+            parts.splice(0, 2);
+            const adapter = parts[0];
+            const name = parts.splice(1).join('/');
+            this.props.socket.readFile(adapter, name)
+                .then((data) => {
+                let fileData = '';
+                if (data.file !== undefined) {
+                    fileData = data.file;
+                }
+                const newState = { copyPossible: this.state.copyPossible, ext: this.state.ext };
+                // try to detect valid extension
+                if (data.type === 'Buffer') {
+                    if (name.toLowerCase().endsWith('.json5')) {
+                        newState.ext = 'json5';
+                        newState.copyPossible = true;
+                        try {
+                            fileData = atob(bufferToBase64(data.data, true));
+                        }
+                        catch (e) {
+                            console.error('Cannot convert base64 to string');
+                            fileData = '';
+                        }
+                    }
+                    else {
+                        const ext = Utils_1.default.detectMimeType(bufferToBase64(data.data));
+                        if (ext) {
+                            newState.ext = ext;
+                            newState.copyPossible = exports.EXTENSIONS.code.includes(ext) || exports.EXTENSIONS.txt.includes(ext);
+                        }
+                    }
+                }
+                if (newState.copyPossible) {
+                    if (newState.ext && exports.EXTENSIONS.txt.includes(newState.ext)) {
+                        newState.text = fileData;
+                        newState.editingValue = fileData;
+                    }
+                    else if (newState.ext && exports.EXTENSIONS.code.includes(newState.ext)) {
+                        newState.code = fileData;
+                        newState.editingValue = fileData;
+                    }
+                }
+                // @ts-expect-error I don't know how to fix it
+                this.setState(newState);
+            })
+                .catch(e => window.alert(`Cannot read file: ${e}`));
+        }
     }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.timeout && clearTimeout(this.timeout);
-      var parts = this.props.href.split('/');
-      parts.splice(0, 2);
-      var adapter = parts[0];
-      var name = parts.splice(1).join('/');
-      this.props.supportSubscribes && this.props.socket.subscribeFiles(adapter, name, this.onFileChanged);
+    componentDidMount() {
+        this.readFile();
+        const parts = this.props.href.split('/');
+        parts.splice(0, 2);
+        const adapter = parts[0];
+        const name = parts.splice(1).join('/');
+        this.props.supportSubscribes && this.props.socket.subscribeFiles(adapter, name, this.onFileChanged);
+    }
+    componentWillUnmount() {
+        this.timeout && clearTimeout(this.timeout);
+        const parts = this.props.href.split('/');
+        parts.splice(0, 2);
+        const adapter = parts[0];
+        const name = parts.splice(1).join('/');
+        this.props.supportSubscribes && this.props.socket.subscribeFiles(adapter, name, this.onFileChanged);
     }
-  }, {
-    key: "getContent",
-    value: function getContent() {
-      var _this3 = this;
-      if (EXTENSIONS.images.includes(this.state.ext)) {
-        if (this.state.imgError) {
-          return /*#__PURE__*/_react["default"].createElement(_IconNoIcon["default"], {
-            className: _Utils["default"].clsx(this.props.classes.img, this.props.getClassBackgroundImage())
-          });
+    static getEditFile(ext) {
+        switch (ext) {
+            case 'json':
+                return 'json';
+            case 'json5':
+                return 'json5';
+            case 'js':
+                return 'javascript';
+            case 'html':
+                return 'html';
+            case 'txt':
+                return 'html';
+            default:
+                return 'json';
         }
-        return /*#__PURE__*/_react["default"].createElement("img", {
-          onError: function onError(e) {
-            e.target.onerror = null;
-            _this3.setState({
-              imgError: true
-            });
-          },
-          className: _Utils["default"].clsx(this.props.classes.img, this.props.getClassBackgroundImage()),
-          src: "".concat(this.props.href, "?ts=").concat(this.state.forceUpdate),
-          alt: this.props.href
-        });
-      }
-      if (this.state.code !== null || this.state.text !== null || this.state.editing) {
-        // File viewer in adapter-react does not support write
-        // return <AceEditor
-        //     mode={FileViewer.getEditFile(this.props.formatEditFile)}
-        //     width="100%"
-        //     height="100%"
-        //     theme={this.props.themeName === 'dark' ? 'clouds_midnight' : 'chrome'}
-        //     value={this.state.editingValue || this.state.code || this.state.text}
-        //     onChange={newValue => this.setState({ editingValue: newValue, changed: true })}
-        //     name="UNIQUE_ID_OF_DIV"
-        //     readOnly={!this.state.editing}
-        //     fontSize={14}
-        //     setOptions={{
-        //         enableBasicAutocompletion: true,
-        //         enableLiveAutocompletion: true,
-        //         enableSnippets: true,
-        //     }}
-        //     editorProps={{ $blockScrolling: true }}
-        // />;
-        return /*#__PURE__*/_react["default"].createElement(_material.TextField, {
-          variant: "standard",
-          className: this.props.classes.textarea,
-          multiline: true,
-          inputProps: {
-            readOnly: !this.state.editing
-          },
-          value: this.state.editingValue || this.state.code || this.state.text
-          // onChange={newValue => this.setState({ editingValue: newValue, changed: true })}
-          ,
-          InputProps: {
-            readOnly: !this.state.editing
-          }
-        });
-      }
-      return null;
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this4 = this;
-      return /*#__PURE__*/_react["default"].createElement(_material.Dialog, {
-        classes: {
-          scrollPaper: this.props.classes.dialog,
-          paper: this.props.classes.paper
-        },
-        scroll: "paper",
-        open: !!this.props.href,
-        onClose: function onClose() {
-          return _this4.props.onClose();
-        },
-        fullWidth: true,
-        maxWidth: "xl",
-        "aria-labelledby": "ar_dialog_file_view_title"
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        className: this.props.classes.dialogTitle
-      }, /*#__PURE__*/_react["default"].createElement(_material.DialogTitle, {
-        id: "ar_dialog_file_view_title"
-      }, "".concat(this.props.t(this.state.editing ? 'Edit' : 'View'), ": ").concat(this.props.href)), EXTENSIONS.images.includes(this.state.ext) && /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_material.IconButton, {
-        size: "large",
-        color: "inherit",
-        onClick: this.props.setStateBackgroundImage
-      }, /*#__PURE__*/_react["default"].createElement(_iconsMaterial.Brightness6, null)))), /*#__PURE__*/_react["default"].createElement(_material.DialogContent, {
-        className: this.props.classes.content
-      }, this.getContent()), /*#__PURE__*/_react["default"].createElement(_material.DialogActions, null, this.state.copyPossible ? /*#__PURE__*/_react["default"].createElement(_material.Button, {
-        color: "grey",
-        onClick: function onClick(e) {
-          return _Utils["default"].copyToClipboard(_this4.state.text || _this4.state.code, e);
-        },
-        startIcon: /*#__PURE__*/_react["default"].createElement(_fa.FaCopy, null)
-      }, this.props.t('Copy content')) : null, this.state.editing ? /*#__PURE__*/_react["default"].createElement(_material.Button, {
-        color: "grey",
-        disabled: this.state.editingValue === this.state.code || this.state.editingValue === this.state.text,
-        variant: "contained",
-        onClick: this.writeFile64,
-        startIcon: /*#__PURE__*/_react["default"].createElement(_iconsMaterial.Save, null)
-      }, this.props.t('Save')) : null, /*#__PURE__*/_react["default"].createElement(_material.Button, {
-        variant: "contained",
-        onClick: function onClick() {
-          return _this4.props.onClose();
-        },
-        color: "primary",
-        startIcon: /*#__PURE__*/_react["default"].createElement(_iconsMaterial.Close, null)
-      }, this.props.t('Close'))));
+    getContent() {
+        if (this.state.ext && exports.EXTENSIONS.images.includes(this.state.ext)) {
+            if (this.state.imgError) {
+                return react_1.default.createElement(IconNoIcon_1.default, { className: Utils_1.default.clsx(this.props.classes.img, this.props.getClassBackgroundImage()) });
+            }
+            return react_1.default.createElement("img", { onError: e => {
+                    // @ts-ignore-error to check
+                    e.target.onerror = null;
+                    this.setState({ imgError: true });
+                }, className: Utils_1.default.clsx(this.props.classes.img, this.props.getClassBackgroundImage()), src: `${this.props.href}?ts=${this.state.forceUpdate}`, alt: this.props.href });
+        }
+        if (this.state.code !== null || this.state.text !== null || this.state.editing) {
+            // File viewer in adapter-react does not support write
+            // return <AceEditor
+            //     mode={FileViewer.getEditFile(this.props.formatEditFile)}
+            //     width="100%"
+            //     height="100%"
+            //     theme={this.props.themeName === 'dark' ? 'clouds_midnight' : 'chrome'}
+            //     value={this.state.editingValue || this.state.code || this.state.text}
+            //     onChange={newValue => this.setState({ editingValue: newValue, changed: true })}
+            //     name="UNIQUE_ID_OF_DIV"
+            //     readOnly={!this.state.editing}
+            //     fontSize={14}
+            //     setOptions={{
+            //         enableBasicAutocompletion: true,
+            //         enableLiveAutocompletion: true,
+            //         enableSnippets: true,
+            //     }}
+            //     editorProps={{ $blockScrolling: true }}
+            // />;
+            return react_1.default.createElement(material_1.TextField, { variant: "standard", className: this.props.classes.textarea, multiline: true, inputProps: { readOnly: !this.state.editing }, value: this.state.editingValue || this.state.code || this.state.text, 
+                // onChange={newValue => this.setState({ editingValue: newValue, changed: true })}
+                InputProps: { readOnly: !this.state.editing } });
+        }
+        return null;
     }
-  }], [{
-    key: "getEditFile",
-    value: function getEditFile(ext) {
-      switch (ext) {
-        case 'json':
-          return 'json';
-        case 'json5':
-          return 'json5';
-        case 'js':
-          return 'javascript';
-        case 'html':
-          return 'html';
-        case 'txt':
-          return 'html';
-        default:
-          return 'json';
-      }
+    render() {
+        return react_1.default.createElement(material_1.Dialog, { classes: { scrollPaper: this.props.classes.dialog, paper: this.props.classes.paper }, scroll: "paper", open: !!this.props.href, onClose: () => this.props.onClose(), fullWidth: true, maxWidth: "xl", "aria-labelledby": "ar_dialog_file_view_title" },
+            react_1.default.createElement("div", { className: this.props.classes.dialogTitle },
+                react_1.default.createElement(material_1.DialogTitle, { id: "ar_dialog_file_view_title" }, `${this.props.t(this.state.editing ? 'Edit' : 'View')}: ${this.props.href}`),
+                this.state.ext && exports.EXTENSIONS.images.includes(this.state.ext) && react_1.default.createElement("div", null,
+                    react_1.default.createElement(material_1.IconButton, { size: "large", color: "inherit", onClick: this.props.setStateBackgroundImage },
+                        react_1.default.createElement(icons_material_1.Brightness6, null)))),
+            react_1.default.createElement(material_1.DialogContent, { className: this.props.classes.content }, this.getContent()),
+            react_1.default.createElement(material_1.DialogActions, null,
+                this.state.copyPossible ?
+                    react_1.default.createElement(material_1.Button
+                    // @ts-expect-error grey is valid color
+                    , { 
+                        // @ts-expect-error grey is valid color
+                        color: "grey", onClick: e => {
+                            e.stopPropagation();
+                            e.preventDefault();
+                            Utils_1.default.copyToClipboard(this.state.text || this.state.code || '');
+                        }, startIcon: react_1.default.createElement(fa_1.FaCopy, null) }, this.props.t('Copy content')) : null,
+                this.state.editing ?
+                    react_1.default.createElement(material_1.Button
+                    // @ts-expect-error grey is valid color
+                    , { 
+                        // @ts-expect-error grey is valid color
+                        color: "grey", disabled: this.state.editingValue === this.state.code || this.state.editingValue === this.state.text, variant: "contained", onClick: this.writeFile64, startIcon: react_1.default.createElement(icons_material_1.Save, null) }, this.props.t('Save')) : null,
+                react_1.default.createElement(material_1.Button, { variant: "contained", onClick: () => this.props.onClose(), color: "primary", startIcon: react_1.default.createElement(icons_material_1.Close, null) }, this.props.t('Close'))));
     }
-  }]);
-  return FileViewer;
-}(_react.Component);
-FileViewer.propTypes = {
-  t: _propTypes["default"].func,
-  onClose: _propTypes["default"].func,
-  href: _propTypes["default"].string.isRequired,
-  supportSubscribes: _propTypes["default"].bool
-};
-
-/** @type {typeof FileViewer} */
-var _export = (0, _withWidth["default"])()((0, _styles.withStyles)(styles)(FileViewer));
-var _default = exports["default"] = _export;
-//# sourceMappingURL=FileViewer.js.map
+}
+exports.default = (0, withWidth_1.default)()((0, styles_1.withStyles)(styles)(FileViewer));