import { useEffect, useState } from "react"; import { connect } from "react-redux"; import { Link } from "react-router-dom"; import { actionSnippetById } from "store/actions/actionSnippetById"; import { Editor } from "components/Editor"; import "components/EditorsPage.css"; const SearchProjectSnippet = ({ getSnippet, match: { params: { id }, }, titleText, descriptionText, filesArr, }) => { useEffect(() => { getSnippet(id); }, [id, getSnippet]); const [files, setFiles] = useState([]); const [title, setTitle] = useState(""); const [description, setDescription] = useState(""); useEffect(() => { setFiles(filesArr); setTitle(titleText); setDescription(descriptionText); }, [filesArr, titleText, descriptionText]); const [srcDoc, setSrcDoc] = useState(""); const html = files?.filter(e => e?.type === "html")[0]?.text; const css = files?.filter(e => e?.type === "css")[0]?.text; const javascript = files?.filter(e => e?.type === "javascript")[0]?.text; console.log(javascript); useEffect(() => { const timeout = setTimeout(() => { setSrcDoc(` ${html} `); }, 250); return () => clearTimeout(timeout); }, [html, css, javascript]); return (

{files?.map((data, index) => ( <> setFiles([...files.slice(0, index), { type, name, text }, ...files.slice(index, 1)]) } /> ))}