feat: im1

futa-clone/src/components/App.jsx

@@ -0,0 +1,52 @@
+import { useState, useEffect } from 'react';
+import PostForm from './PostForm';
+import SearchForm from './SearchForm';
+import PostList from './PostList';
+import Greeting from './Greeting';
+import GraphContainer from './GraphContainer';
+import { API_URL } from '../config';
+import '../App.css';
+
+function App() {
+  const [posts, setPosts] = useState([]);
+  const [searchResults, setSearchResults] = useState([]);
+  const [userVector, setUserVector] = useState(
+    JSON.parse(localStorage.getItem('userVector')) || null
+  );
+
+  useEffect(() => {
+    loadPosts();
+  }, []);
+
+  const loadPosts = async () => {
+    try {
+      const response = await fetch(`${API_URL}/posts/`);
+      const data = await response.json();
+      setPosts(data);
+    } catch (error) {
+      console.error('Error loading posts:', error);
+    }
+  };
+
+  return (
+    <div className="app">
+      <Greeting show={!userVector} />
+      
+      {userVector && <GraphContainer vector={userVector} />}
+
+      <PostForm 
+        onPostCreated={(vector) => {
+          localStorage.setItem('userVector', JSON.stringify(vector));
+          setUserVector(vector);
+          loadPosts();
+        }}
+      />
+
+      <SearchForm onSearch={setSearchResults} />
+      
+      <PostList posts={searchResults.length > 0 ? searchResults : posts} />
+    </div>
+  );
+}
+
+export default App;

futa-clone/src/components/GraphContainer.jsx

@@ -0,0 +1,94 @@
+import { useState, useEffect, useRef } from 'react';
+import vis from 'vis-network/standalone/umd/vis-network.min';
+import { API_URL } from '../config';
+
+function GraphContainer({ vector }) {
+  const [posts, setPosts] = useState([]);
+  const networkRef = useRef(null);
+  const containerRef = useRef(null);
+
+  useEffect(() => {
+    const loadTree = async () => {
+      try {
+        const response = await fetch(`${API_URL}/posts/tree`, {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ vector }),
+        });
+        const data = await response.json();
+        
+        // Добавлен лог полученных данных
+        console.log('Данные, полученные с сервера:', data);
+        
+        setPosts(data);
+      } catch (error) {
+        console.error('Tree load error:', error);
+      }
+    };
+
+    loadTree();
+  }, [vector]);
+
+  // Остальной код без изменений
+  useEffect(() => {
+    if (posts.length > 0 && containerRef.current) {
+      const { nodes, edges } = createGraphData(posts);
+      
+      const options = {
+        nodes: {
+          borderWidth: 2,
+          color: { border: '#800', background: '#F0E0D6' },
+          font: { size: 14 }
+        },
+        edges: {
+          color: '#800',
+          width: 2,
+          arrows: 'to',
+          smooth: { type: 'curvedCW' }
+        },
+        physics: {
+          stabilization: true,
+          barnesHut: { gravitationalConstant: -2000, springLength: 200 }
+        }
+      };
+
+      networkRef.current = new vis.Network(
+        containerRef.current,
+        { nodes, edges },
+        options
+      );
+    }
+
+    return () => {
+      if (networkRef.current) {
+        networkRef.current.destroy();
+      }
+    };
+  }, [posts]);
+
+  return (
+    <div className="graph-container">
+      <h2>Ризома мыслительная</h2>
+      <div ref={containerRef} style={{ width: '100%', height: '600px', border: '0px solid #800' }} />
+    </div>
+  );
+}
+
+function createGraphData(posts) {
+  const nodes = posts.map(post => ({
+    id: post.id,
+    label: post.text || '[Изображение]',
+    image: post.image ? `${API_URL}/${post.image}` : 'https://via.placeholder.com/100',
+    shape: 'circularImage',
+    size: 25
+  }));
+
+  const edges = posts.slice(1).map((post, index) => ({
+    from: posts[index].id,
+    to: post.id
+  }));
+
+  return { nodes, edges };
+}
+
+export default GraphContainer;

futa-clone/src/components/Greeting.jsx

@@ -0,0 +1,9 @@
+function Greeting({ show }) {
+    return show ? (
+      <div id="greeting">
+        <h2>Отправьте первое сообщение, чтобы начать</h2>
+      </div>
+    ) : null;
+  }
+  
+  export default Greeting;

futa-clone/src/components/PostForm.jsx

@@ -0,0 +1,61 @@
+import { useState } from 'react';
+import { API_URL } from '../config';
+
+function PostForm({ onPostCreated }) {
+  const [text, setText] = useState('');
+  const [image, setImage] = useState(null);
+  const [preview, setPreview] = useState('');
+
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    const formData = new FormData();
+    if (text) formData.append('text', text);
+    if (image) formData.append('image', image);
+
+    try {
+      const response = await fetch(`${API_URL}/posts/`, {
+        method: 'POST',
+        body: formData,
+      });
+      
+      if (response.ok) {
+        const data = await response.json();
+        onPostCreated(data.vector);
+        setText('');
+        setImage(null);
+        setPreview('');
+      }
+    } catch (error) {
+      console.error('Post creation error:', error);
+    }
+  };
+
+  const handleImageChange = (e) => {
+    const file = e.target.files[0];
+    if (file) {
+      setImage(file);
+      const reader = new FileReader();
+      reader.onload = () => setPreview(reader.result);
+      reader.readAsDataURL(file);
+    }
+  };
+
+  return (
+    <div className="post-form">
+      <h2>Новый пост</h2>
+      <form onSubmit={handleSubmit}>
+        <textarea
+          value={text}
+          onChange={(e) => setText(e.target.value)}
+          rows="4"
+          placeholder="Текст поста"
+        />
+        <input type="file" onChange={handleImageChange} accept="image/*" />
+        {preview && <img src={preview} className="preview-image" alt="Preview" />}
+        <button type="submit">Отправить</button>
+      </form>
+    </div>
+  );
+}
+
+export default PostForm;

futa-clone/src/components/PostList.jsx

@@ -0,0 +1,19 @@
+import { API_URL } from '../config';
+
+function PostList({ posts }) {
+    return (
+      <div id="postsContainer">
+        {posts.map(post => (
+          <div key={post.id} className="post">
+            <div className="post-meta">
+              #{post.id} - {new Date(post.created_at).toLocaleString()}
+            </div>
+            {post.text && <div className="post-text">{post.text}</div>}
+            {post.image && <img src={`${API_URL}/${post.image}`} alt="Post" />}
+          </div>
+        ))}
+      </div>
+    );
+  }
+  
+  export default PostList;

futa-clone/src/components/SearchForm.jsx

@@ -0,0 +1,31 @@
+import { useState } from 'react';
+import { API_URL } from '../config';
+
+function SearchForm({ onSearch }) {
+  const [query, setQuery] = useState('');
+
+  const handleSearch = async () => {
+    try {
+      const response = await fetch(`${API_URL}/search?text=${encodeURIComponent(query)}`);
+      const results = await response.json();
+      onSearch(results);
+    } catch (error) {
+      console.error('Search error:', error);
+    }
+  };
+
+  return (
+    <div className="post-form">
+      <h2>Поиск</h2>
+      <input
+        type="text"
+        value={query}
+        onChange={(e) => setQuery(e.target.value)}
+        placeholder="Текст для поиска"
+      />
+      <button onClick={handleSearch}>Искать</button>
+    </div>
+  );
+}
+
+export default SearchForm;