This commit is contained in:
Little Dipper 2023-06-18 21:22:25 +02:00
parent e97cacebd5
commit 263e3332a1
14 changed files with 57 additions and 48 deletions

View File

@ -23,7 +23,7 @@
"react-scripts": "5.0.1",
"socket.io-client": "^4.6.1",
"styled-components": "^5.3.10",
"typescript": "^3.2.1",
"typescript": "^3.9.10",
"web-vitals": "^2.1.4"
}
},
@ -20221,9 +20221,9 @@
}
},
"node_modules/typescript": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.2.1.tgz",
"integrity": "sha512-jw7P2z/h6aPT4AENXDGjcfHTu5CSqzsbZc6YlUIebTyBAq8XaKp78x7VcSh30xwSCcsu5irZkYZUSFP1MrAMbg==",
"version": "3.9.10",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.10.tgz",
"integrity": "sha512-w6fIxVE/H1PkLKcCPsFqKE7Kv7QUwhU8qQY2MueZXWx5cPZdwFupLgKK3vntcK98BtNHZtAF4LA/yl2a7k8R6Q==",
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@ -35362,9 +35362,9 @@
}
},
"typescript": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.2.1.tgz",
"integrity": "sha512-jw7P2z/h6aPT4AENXDGjcfHTu5CSqzsbZc6YlUIebTyBAq8XaKp78x7VcSh30xwSCcsu5irZkYZUSFP1MrAMbg=="
"version": "3.9.10",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.10.tgz",
"integrity": "sha512-w6fIxVE/H1PkLKcCPsFqKE7Kv7QUwhU8qQY2MueZXWx5cPZdwFupLgKK3vntcK98BtNHZtAF4LA/yl2a7k8R6Q=="
},
"unbox-primitive": {
"version": "1.0.2",

View File

@ -18,7 +18,7 @@
"react-scripts": "5.0.1",
"socket.io-client": "^4.6.1",
"styled-components": "^5.3.10",
"typescript": "^3.2.1",
"typescript": "^3.9.10",
"web-vitals": "^2.1.4"
},
"scripts": {

View File

@ -3,11 +3,11 @@ import io from 'socket.io-client';
import '../../styles/Messages.css'
import styled from "styled-components";
import DefaultPic from '../../assets/profile.jpg'
import api from '../../script/axiosApi.tsx';
import api from '../../script/axiosApi.tsx'
import { motion , AnimatePresence} from "framer-motion";
import Modal from "./Modal.tsx";
import Message from "./Message.tsx"
import Message from './Message.tsx';
// import Input from "./Input";
//react icons

View File

@ -1,6 +1,7 @@
import { useEffect, useLocation } from 'react';
import React from 'react';
import { useEffect } from 'react';
// import { useState, useRef } from 'react';
import DrawCanvas from './canvas.tsx';
import DrawCanvas from './canvas';
import queryString from 'query-string';
import '../styles/field.css';

View File

@ -1,6 +1,6 @@
import React from "react";
import PlayButton from "../components/Game/PlayButton.tsx";
import Ranking from "../components/Game/Ranking.tsx";
import PlayButton from "../components/Game/PlayButton";
import Ranking from "../components/Game/Ranking";
import '../styles/Game.css'
function Game(){

View File

@ -1,3 +1,5 @@
import React from "react";
function Head()
{
return (

View File

@ -13,18 +13,18 @@
// import { React, useState } from "react";
import '../styles/Profile.css'
// import '../styles/App.css'
import DefaultPicture from "../assets/profile.jpg";
import WinLoss from "../components/Profile/Win_Loss.tsx";
// import DefaultPicture from "../assets/profile.jpg";
import WinLoss from "../components/Profile/Win_Loss";
import { motion, AnimatePresence } from 'framer-motion'
// import { AiFillEdit } from 'react-icons/ai'
// import { GrClose } from 'react-icons/gr'
import { Link } from "react-router-dom";
import ModalEdit from "../components/Profile/EditName.tsx";
import ModalEdit from "../components/Profile/EditName";
import {AiOutlineHistory} from 'react-icons/ai'
// import { Link } from "react-router-dom";
// import {UserProfile} from "../DataBase/DataUserProfile";
// import axios from "axios";
import api from '../script/axiosApi.tsx';
import api from '../script/axiosApi';
import { CgEditMarkup } from 'react-icons/cg'
import { IoCloseCircleOutline } from "react-icons/io5";
@ -43,6 +43,7 @@ import { useParams } from 'react-router-dom';
function Profile () {
const DefaultPicture: string = "../assets/profile.jpg";
const [user, setUser] = useState(null);
const [isLoading, setIsLoading] = useState(true);
const [modalOpen, setModalOpen] = useState(false);
@ -67,8 +68,10 @@ function Profile () {
};
const handleUpload = async () => {
const formData = new FormData();
const formData: FormData = new FormData();
if (selectedPhoto){
formData.append('photo', selectedPhoto);
}
try {
await api.post('/picture', formData);
console.log('File uploaded successfully');
@ -125,7 +128,9 @@ function Profile () {
{isLoading ? (
<h1>Loading...</h1>
) : (
user ? (
<h1>{user.nickname}</h1>
) : ("")
)}
</span>

View File

@ -1,6 +1,7 @@
// import GoogleLogin from 'react-google-login';
import { useEffect } from 'react';
import axios from 'axios';
import React from 'react';
// import setupLogin from '../script/login42';
// import React, { useEffect } from 'react';

View File

@ -1,31 +1,14 @@
import React from "react";
// import Sidebar from '../components/Messages/Sidebar'
import Chats from "../components/Messages/Chats.tsx"
import Chats from "../components/Messages/Chats"
import '../styles/Messages.css'
import { motion } from 'framer-motion'
// import {io} from 'socket.io-client'
function Messages(params) {
// const socket = useRef(io("ws://localhost:8900"))
// useEffect(() => {
// setSocket(io("ws://localhost:8900"))
// }, [])
// const socket = socketIO.connect('http://localhost:4000');
// axios.get('http://localhost/api/user/id')
// .then(function());
// console.log(socket)
// useEffect(() => {
// socket.current.emit("addUser", user._id);
// socket.current.on("getUsers", users=>{
// console.log(users)
// })
// }, [user])
function Messages() {
return (
<>
<div>
<motion.div className="home"
initial={{opacity: 0}}
animate={{opacity: 1}}
@ -35,7 +18,7 @@ function Messages(params) {
<Chats/>
</div>
</motion.div>
</>
</div>
);
}

View File

@ -1,3 +1,4 @@
import React from 'react';
import '../styles/field.css';
// import { useHistory } from 'react-router-dom';
import { useNavigate } from "react-router-dom";

View File

@ -3,10 +3,11 @@ import React, { useEffect, useRef, useState } from "react";
// import { redirect } from "react-router-dom";
import "../styles/App.css";
import api from '../script/axiosApi.tsx';
import api from '../script/axiosApi';
import QRCodeStyling from "qr-code-styling";
import { motion } from 'framer-motion'
import { MutableRefObject } from "react";
@ -29,7 +30,8 @@ const qrCode = new QRCodeStyling({
function QrCode () {
// const url = "https://www.youtube.com";
const ref = useRef(null);
// const ref = useRef(null);
const ref: MutableRefObject<HTMLElement | null> = {current: null};
const [user, setUser] = useState(false);
const [url, setUrl] = useState(false);
const [secret, setSecret] = useState(false);
@ -39,7 +41,9 @@ function QrCode () {
// const history = useHistory();
useEffect(() => {
if (ref.current){
qrCode.append(ref.current);
}
const getUser = async ()=>{
try{

View File

@ -1,6 +1,6 @@
// import io from 'socket.io-client';
import api from '../script/axiosApi.tsx';
import api from '../script/axiosApi';
// import { useEffect, useRef } from 'react';
import io from 'socket.io-client';

View File

@ -50,7 +50,8 @@ select{
.contact{
background-color: rgb(46, 46, 46);
align-items: left;
height: 30.2rem;
height: 74vh;
width: 30%;
overflow: scroll;
/* width: 2rem; */
/* height: 4rem; */
@ -92,6 +93,8 @@ select{
}
.navbar{
/* width: clamp(50%, 500px, 20%); */
/* height: min(50%, 100px); */
display: flex;
align-items: center;
/* background-color: yellow; */
@ -130,6 +133,7 @@ select{
background-color: rgb(26, 26, 26);
/* height: calc(100% - 118px); */
width: 70%;
/* height: 300px; */
overflow: scroll;
}

View File

@ -0,0 +1,8 @@
{
"compiledOptions": {
"composite": true,
"allowJs": true,
"allowImportingTsExtensions": true,
"jsx": "react"
}
}