From b186abb6ab2a83658a5ba390b9ffa3eba3c2fee6 Mon Sep 17 00:00:00 2001 From: rakib Date: Fri, 4 Oct 2024 15:07:43 -0400 Subject: [PATCH] Logs Removed --- server.ts | 9 ++ src/App.tsx | 159 ++++++++++++++++--------------- src/components/Auth/auth.tsx | 6 +- src/components/Banner/banner.tsx | 9 +- src/components/Header/header.tsx | 8 +- src/components/Movie/movie.tsx | 14 +-- 6 files changed, 112 insertions(+), 93 deletions(-) diff --git a/server.ts b/server.ts index fefc61c..d3819f9 100644 --- a/server.ts +++ b/server.ts @@ -1,3 +1,12 @@ +// ES Lint Ignore Minor Syntax Warnings +// ------------------------------------ +/* eslint-disable semi */ +/* eslint-disable prefer-const */ +/* eslint-disable no-extra-semi */ +/* eslint-disable @typescript-eslint/no-unused-vars */ +/* eslint-disable @typescript-eslint/no-explicit-any */ +/* eslint-disable @typescript-eslint/no-inferrable-types */ + const express = require("express"); const app = express(); const path = require("path"); diff --git a/src/App.tsx b/src/App.tsx index 1a6aac5..ead5fbb 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,41 +1,42 @@ +import './styles/App.css'; + import * as React from 'react'; -import { useEffect, useState } from "react"; -import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; import Auth from './components/Auth/auth'; import Home from './components/Home/home'; -import TVShows from './components/TVShows/tvshows'; +import { useEffect, useState } from "react"; import Movies from './components/Movies/movies'; import Latest from './components/Latest/latest'; -import './styles/App.css'; +import TVShows from './components/TVShows/tvshows'; +import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; // Global Variables declare global { namespace JSX { interface IntrinsicElements { - 'footer': React.DetailedHTMLProps, HTMLElement>, + 'footer': React.DetailedHTMLProps, HTMLElement>, } } namespace TSX { interface IntrinsicElements { - 'footer': React.DetailedHTMLProps, HTMLElement>, + 'footer': React.DetailedHTMLProps, HTMLElement>, } -} + } interface State { user?: any, setUser?: any, - email?:any, - setEmail?:any, + email?: any, + setEmail?: any, updateUser?: any, - movie?:any, + movie?: any, movies?: any, setMovie?: any, setMovies?: any, index?: any title?: string, - open?:any, - setOpen?:any, + open?: any, + setOpen?: any, movieURL?: any, - movieURLS?:any, + movieURLS?: any, fetchMovie?: any, bannerMovie?: any, randomMovieURL?: any, @@ -43,6 +44,9 @@ declare global { } } +// Options +export const logs = false; + // Global DOM Elements export const plus = document.querySelector(`#plus`); export const minus = document.querySelector(`#minus`); @@ -50,13 +54,12 @@ export const banner = document.querySelector(`#banner`); export const signUpForm = document.querySelector(`#signUpForm`); export const signInForm = document.querySelector(`#signInForm`); export const pageName = window.location.pathname.replace(`/`,``); -export const listItems:any = document.querySelector(`#listItems`); +export const listItems: any = document.querySelector(`#listItems`); export const emailForm = document.querySelector(`#emailAddressForm`); export const sliderNext = document.querySelector(`.react-Slidy-next`); // API Elements export const APIKey = process.env.REACT_APP_API_KEY || process.env.API_KEY; -console.log(`API Key`, APIKey); export const baseImageURL = `https://image.tmdb.org/t/p/original`; export const baseTMDBURL = `https://api.themoviedb.org/3`; export const movieURLS = { @@ -78,18 +81,18 @@ export const randomMovieURL = movieURLArray[Math.floor(Math.random() * lastMovie // Helper Functions // Cut Off Long Strings of Text -export const truncate = (string:string,end:number) => { +export const truncate = (string: string, end: number) => { return string?.length > end ? string?.substring(0, end - 1) + `-` : string; } // Capitalize First Letter of Word -export const capitalizeWord = (word?:any) => { +export const capitalizeWord = (word?: any) => { let capitalizedWord = word?.charAt(0)?.toUpperCase() + word?.slice(1); return capitalizedWord || word; } // Youtube Player Options -export const opts:any = { +export const opts: any = { width: "100%", host: "https://www.youtube.com", height: "400", @@ -99,24 +102,24 @@ export const opts:any = { } // Remove Duplicate Objects from Array -export const removeDuplicateObjFromArray = (array?:any) => { - const uniqueArray = array?.filter((value?:any, index?:any) => { - const _value = JSON.stringify(value); - return index === array?.findIndex((obj?:any) => { - return JSON.stringify(obj) === _value; - }); +export const removeDuplicateObjFromArray = (array?: any) => { + const uniqueArray = array?.filter((value?: any, index?: any) => { + const _value = JSON.stringify(value); + return index === array?.findIndex((obj?: any) => { + return JSON.stringify(obj) === _value; + }); }); return uniqueArray; } // State -export const getCurrentUser:any = localStorage.getItem(`User`); -export const currentUser:any = JSON.parse(getCurrentUser); +export const getCurrentUser: any = localStorage.getItem(`User`); +export const currentUser: any = JSON.parse(getCurrentUser); // Add Movie -export const addMovie = async (movie?:any, user?:any, setUser?:any) => { +export const addMovie = async (movie?: any, user?: any, setUser?: any) => { const movieName = movie?.name || movie?.title || movie?.original_name; - console.log(`Add Movie`, movieName); + logs && console.log(`Add Movie`, movieName); const emailAddress = user?.email; const username = user?.username; const password = user?.password; @@ -124,35 +127,35 @@ export const addMovie = async (movie?:any, user?:any, setUser?:any) => { const list = user?.list; const reversedList = list?.reverse(); setUser({ - username, - password, - email: emailAddress, - list: removeDuplicateObjFromArray(reversedList) + username, + password, + email: emailAddress, + list: removeDuplicateObjFromArray(reversedList), }) } // Delete Movie -export const deleteMovie = async (movie?:any, user?:any, setUser?:any) => { +export const deleteMovie = async (movie?: any, user?: any, setUser?: any) => { const movieName = movie?.name || movie?.title || movie?.original_name; - console.log(`Delete Movie`, movieName); + logs && console.log(`Delete Movie`, movieName); const emailAddress = user?.email; const username = user?.username; const movieID = movie?.id; - const filteredArray = user?.list?.filter((item?:any,index?:any) => item.id !== movieID); + const filteredArray = user?.list?.filter((item?: any, index?: any) => item.id !== movieID); setUser({ username, email: emailAddress, password: user?.password, - list: removeDuplicateObjFromArray(filteredArray) + list: removeDuplicateObjFromArray(filteredArray), }) } // Update Movies -export const update = async (user?:any, setUser?:any, movie?:any, includes?:any) => { - const getUser:any = localStorage.getItem(`User`); +export const update = async (user?: any, setUser?: any, movie?: any, includes?: any) => { + const getUser: any = localStorage.getItem(`User`); user = JSON.parse(getUser) || user; if (includes) { - deleteMovie(movie, user, setUser); + deleteMovie(movie, user, setUser); } else { addMovie(movie, user, setUser); } @@ -160,20 +163,22 @@ export const update = async (user?:any, setUser?:any, movie?:any, includes?:any) } // App Begin -const App:React.FC = () => { +const App: React.FC = () => { - const getUser:any = localStorage.getItem(`User`) || localStorage.getItem(`Last User`); + const getUser: any = localStorage.getItem(`User`) || localStorage.getItem(`Last User`); const [user, setUser] = useState(JSON.parse(getUser)); const [movie, setMovie] = useState(null); const [email, setEmail] = useState(null); useEffect(() => { - const getLastUser:any = localStorage.getItem(`Last User`); + const getLastUser: any = localStorage.getItem(`Last User`); const lastUser = JSON.parse(getLastUser); const body = document.body; + // const x = (array?:any) => Math.floor(Math.random() * array.length); // const randomBanner:any = bannerMovies[x(bannerMovies)]; + if (user?.list?.length === 0) { body?.classList.remove(`items`); body?.classList.add(`empty`); @@ -181,47 +186,47 @@ const App:React.FC = () => { body?.classList.remove(`empty`); body?.classList.add(`items`); } - console.log(`List`, user?.list); - console.log(`User`, user); - console.log(`Last User`, lastUser); + + logs && console.log(`User`, user); + logs && console.log(`List`, user?.list); + logs && console.log(`Last User`, lastUser); }, [user]) return (
- - {!user ? ( - - ) : ( - - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - } /> - - )} - -
+ + {!user ? ( + + ) : ( + + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + } /> + + )} + + ); } - export default App \ No newline at end of file diff --git a/src/components/Auth/auth.tsx b/src/components/Auth/auth.tsx index a64b590..3e80869 100644 --- a/src/components/Auth/auth.tsx +++ b/src/components/Auth/auth.tsx @@ -1,14 +1,14 @@ +import './styles/auth.css'; +import 'react-slidy/lib/styles.css'; + import * as React from 'react'; import ReactSlidy from 'react-slidy'; -import 'react-slidy/lib/styles.css' import Header from '../Header/header'; import Footer from '../Footer/footer'; import GetStarted from './getstarted'; import Registration from './registration'; -import './styles/auth.css'; const Auth:React.FC = ({user, setUser, email, setEmail}) => { - return (
diff --git a/src/components/Banner/banner.tsx b/src/components/Banner/banner.tsx index 038e92f..5eb954c 100644 --- a/src/components/Banner/banner.tsx +++ b/src/components/Banner/banner.tsx @@ -1,12 +1,13 @@ +import "./styles/banner.css"; + import * as React from 'react'; +import Moment from 'react-moment'; +import YouTube from 'react-youtube'; import{ useEffect, useState } from "react"; -import { APIKey, baseTMDBURL, capitalizeWord, truncate, update, opts } from '../../App'; import { Button, Modal } from '@mui/material'; -import "./styles/banner.css"; -import Moment from 'react-moment'; import Dashboard from '../Dashboard/dashboard'; import { LazyLoadImage } from 'react-lazy-load-image-component'; -import YouTube from 'react-youtube'; +import { APIKey, baseTMDBURL, capitalizeWord, truncate, update, opts } from '../../App'; // Good Looking Banner Movies export const bannerMovies = [ diff --git a/src/components/Header/header.tsx b/src/components/Header/header.tsx index 9c1f178..55e9ed9 100644 --- a/src/components/Header/header.tsx +++ b/src/components/Header/header.tsx @@ -1,12 +1,13 @@ +import './styles/header.css'; + import * as React from 'react'; +import MobileMenu from './mobileMenu'; import { Button } from '@mui/material'; import { Link } from 'react-router-dom'; import {useState, useEffect} from "react"; +import Dashboard from '../Dashboard/dashboard'; import { capitalizeWord, listItems } from '../../App'; import { LazyLoadImage } from 'react-lazy-load-image-component'; -import Dashboard from '../Dashboard/dashboard'; -import './styles/header.css'; -import MobileMenu from './mobileMenu'; const Header: React.FC = ({user, setUser}) => { @@ -23,6 +24,7 @@ const Header: React.FC = ({user, setUser}) => { useEffect(() => { localStorage.setItem(`User`, JSON.stringify(user)); + window.addEventListener(`scroll`, event => { transitionHeader(); return () => window.removeEventListener(`scroll`, event => { diff --git a/src/components/Movie/movie.tsx b/src/components/Movie/movie.tsx index a8fc99d..92d7f5d 100644 --- a/src/components/Movie/movie.tsx +++ b/src/components/Movie/movie.tsx @@ -1,23 +1,25 @@ +import './styles/movie.css'; + import * as React from 'react' import { useState } from "react"; -import { truncate, baseImageURL, update, baseTMDBURL, APIKey, opts } from '../../App'; -import { LazyLoadImage } from 'react-lazy-load-image-component'; -import { Button, Modal } from '@mui/material'; import YouTube from 'react-youtube'; -import './styles/movie.css'; +import { Button, Modal } from '@mui/material'; +import { LazyLoadImage } from 'react-lazy-load-image-component'; +import { truncate, baseImageURL, update, baseTMDBURL, APIKey, opts } from '../../App'; export const wideW = `336px`; export const wideH = `189px`; export const posterW = `165px`; export const posterH = `250px`; -const Movie:React.FC = ({user, setUser, movie, index}) => { +const Movie: React.FC = ({user, setUser, movie, index}) => { const posterPic = baseImageURL+movie?.poster_path; const movieName = movie?.name?.split(`:`)[0] || movie?.title?.split(`:`)[0] || movie?.original_name?.split(`:`)[0]; const movieSplit = movieName?.split(` `)[0] + ` ` + movieName?.split(` `)[1]; - const [openTrailer, setOpenTrailer] = useState(false); + const [trailer, setTrailer] = useState(``); + const [openTrailer, setOpenTrailer] = useState(false); return (