From 91383b01b1d5f1acfcb793f420bce98695af4979 Mon Sep 17 00:00:00 2001 From: Thierry Parlier Date: Sat, 14 Oct 2023 19:38:54 +0400 Subject: [PATCH] Cleanup warnings on eslint. Formatted all and modified a typo for create play form --- package.json | 2 +- src/App.css | 2 +- src/common/home/home.css | 2 +- src/common/playlists/PlayThumbnail.jsx | 1 - .../DisplayTrackControls/TrackControlSlice.js | 2 +- .../cricket-game/components/EndGameScreen.jsx | 2 +- src/plays/cricket-game/components/Modal.jsx | 2 +- src/plays/cricket-game/components/TopBar.jsx | 4 ++-- src/plays/cricket-game/game/gameLogic.js | 4 ++-- .../custommemesgenerator/Custommemesgenerator.jsx | 3 +-- .../digital-delight/components/CategoryFact.jsx | 4 ++-- src/plays/digital-delight/components/Modal.jsx | 2 +- src/plays/digital-delight/components/Title.jsx | 2 +- src/plays/hangman-game/Readme.md | 15 +++++++-------- src/plays/hangman-game/components/Drawing.tsx | 2 +- src/plays/hangman-game/components/Keyboard.tsx | 1 - src/plays/hangman-game/components/Word.tsx | 1 - src/plays/hangman-game/constants/constants.tsx | 2 -- src/plays/hangman-game/styles.css | 1 - .../InfiniteScrollWithDebouncingConcept.jsx | 4 ++-- .../MultiplayerTicTacToe.tsx | 3 ++- src/plays/multiselect-component/styles.scss | 2 +- src/plays/object-detector/ObjectDetector.jsx | 1 - .../Components/SideBarOperation.jsx | 2 +- .../components/SavingOptions/savingOptions.scss | 9 ++++----- .../components/Total/total.scss | 2 +- .../styles/savingsCalculator.scss | 5 ++--- .../self-clicking-button/SelfClickingButton.jsx | 2 +- src/plays/tube2tunes/Tube2tunes.jsx | 2 +- 29 files changed, 38 insertions(+), 48 deletions(-) diff --git a/package.json b/package.json index aca6d858b..cd1d7c49a 100644 --- a/package.json +++ b/package.json @@ -97,7 +97,7 @@ "cypress:run": "cypress run", "lint": "eslint src/**/*.{js,jsx,ts,tsx}", "lint:fix": "eslint --fix src/**/*.{js,jsx,ts,tsx}", - "format": "prettier --write \"./src/**/*.{js,jsx,ts,tsx,css,md}\" --config ./.prettierrc", + "format": "prettier --write \"./src/**/*.{js,jsx,ts,tsx,css,scss,md}\" --config ./.prettierrc", "prepare": "husky install", "pre-commit": "lint-staged" }, diff --git a/src/App.css b/src/App.css index 3ba0679a4..ff7d1c142 100644 --- a/src/App.css +++ b/src/App.css @@ -620,4 +620,4 @@ small { ::-webkit-scrollbar { width: 25px; -} \ No newline at end of file +} diff --git a/src/common/home/home.css b/src/common/home/home.css index 687f03a5a..17337fea6 100644 --- a/src/common/home/home.css +++ b/src/common/home/home.css @@ -728,7 +728,7 @@ .heart-handshake { opacity: 0; transition: all 0.2s ease-in-out; - position: absolute; + position: absolute; left: 15rem; } } diff --git a/src/common/playlists/PlayThumbnail.jsx b/src/common/playlists/PlayThumbnail.jsx index 0fbcfb3b8..cf8bba9e9 100644 --- a/src/common/playlists/PlayThumbnail.jsx +++ b/src/common/playlists/PlayThumbnail.jsx @@ -1,7 +1,6 @@ import { useState, useEffect } from 'react'; import { Link } from 'react-router-dom'; import { BsPlayCircleFill } from 'react-icons/bs'; -import thumbPlay from 'images/thumb-play.png'; import Shimmer from 'react-shimmer-effect'; import userImage from 'images/user.png'; import Like from 'common/components/Like/Like'; diff --git a/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js b/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js index dfcdeb76e..7c34d85a5 100644 --- a/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js +++ b/src/plays/codenchill/features/DisplayTrackControls/TrackControlSlice.js @@ -1,4 +1,4 @@ -import { createSlice, current } from '@reduxjs/toolkit'; +import { createSlice } from '@reduxjs/toolkit'; import tracks from '../../data/track'; const initialState = { diff --git a/src/plays/cricket-game/components/EndGameScreen.jsx b/src/plays/cricket-game/components/EndGameScreen.jsx index 2ec6dd551..3e412b711 100644 --- a/src/plays/cricket-game/components/EndGameScreen.jsx +++ b/src/plays/cricket-game/components/EndGameScreen.jsx @@ -16,7 +16,7 @@ export default function EndGameScreen({ endScreenRef, resultTitle, resultDesc, r diff --git a/src/plays/cricket-game/components/TopBar.jsx b/src/plays/cricket-game/components/TopBar.jsx index d3ff7703b..50889ce2b 100644 --- a/src/plays/cricket-game/components/TopBar.jsx +++ b/src/plays/cricket-game/components/TopBar.jsx @@ -26,13 +26,13 @@ export default function TopBar({ hitBoxRef, gameTrack }) { diff --git a/src/plays/cricket-game/game/gameLogic.js b/src/plays/cricket-game/game/gameLogic.js index 1227dffc5..57fff1177 100644 --- a/src/plays/cricket-game/game/gameLogic.js +++ b/src/plays/cricket-game/game/gameLogic.js @@ -1,4 +1,4 @@ -import { plural, sleep, randomChoice } from './utils.js'; +import { sleep, randomChoice } from './utils.js'; import { COMMENTARY } from './commentary.js'; export class GameState { @@ -87,7 +87,7 @@ export function hitTheBall(event, ballCentre, shotBallRef) { shotBallRef.current.classList.add(shotName); // Reset shot ball's position now - sleep(1 * 1000).then((resp) => { + sleep(1 * 1000).then(() => { shotBallRef.current.classList.add('invisible'); shotBallRef.current.classList.remove(shotName); diff --git a/src/plays/custommemesgenerator/Custommemesgenerator.jsx b/src/plays/custommemesgenerator/Custommemesgenerator.jsx index 284af0368..3aefca12c 100644 --- a/src/plays/custommemesgenerator/Custommemesgenerator.jsx +++ b/src/plays/custommemesgenerator/Custommemesgenerator.jsx @@ -1,10 +1,9 @@ -import PlayHeader from 'common/playlists/PlayHeader'; import './Custommemesgenerator.css'; import Header from './Header.jsx'; import Meme from './Meme.jsx'; // WARNING: Do not change the entry componenet name -function Custommemesgenerator(props) { +function Custommemesgenerator() { // Your Code Start below. return ( diff --git a/src/plays/digital-delight/components/CategoryFact.jsx b/src/plays/digital-delight/components/CategoryFact.jsx index 8ed3c8c5d..6df1f3adf 100644 --- a/src/plays/digital-delight/components/CategoryFact.jsx +++ b/src/plays/digital-delight/components/CategoryFact.jsx @@ -8,7 +8,7 @@ import './Categoryfact.css'; function CategoryFact() { const [fact, setFact] = useState(CategoryFacts); - const [error, setError] = useState(''); + // const [error, setError] = useState(''); const [selectedVoice, setSelectedVoice] = useState('Zira'); const [showSelecter, setShowSelecter] = useState(false); const speechHandler = (msg) => { @@ -42,7 +42,7 @@ function CategoryFact() { speechHandler(new SpeechSynthesisUtterance(data.number + ' is ' + data.text)); setShowSelecter(true); } catch (error) { - setError('Error fetching fact. Please try again later.'); + // setError('Error fetching fact. Please try again later.'); } }; diff --git a/src/plays/digital-delight/components/Modal.jsx b/src/plays/digital-delight/components/Modal.jsx index b734a1a88..f6b14066f 100644 --- a/src/plays/digital-delight/components/Modal.jsx +++ b/src/plays/digital-delight/components/Modal.jsx @@ -7,7 +7,7 @@ import { MdClose } from 'react-icons/md'; const Modal = ({ showModal, toggle }) => { const [currState, setCurrentState] = useState(0); - const data = structuringData[currState]; + // const data = structuringData[currState]; useEffect(() => { setCurrentState(0); diff --git a/src/plays/digital-delight/components/Title.jsx b/src/plays/digital-delight/components/Title.jsx index a2ef9aea2..dc2e8e2a7 100644 --- a/src/plays/digital-delight/components/Title.jsx +++ b/src/plays/digital-delight/components/Title.jsx @@ -1,4 +1,4 @@ -import React, { useState } from 'react'; +import React from 'react'; import './Title.css'; function RealTitle() { diff --git a/src/plays/hangman-game/Readme.md b/src/plays/hangman-game/Readme.md index 13102f209..1fb9cf580 100644 --- a/src/plays/hangman-game/Readme.md +++ b/src/plays/hangman-game/Readme.md @@ -1,6 +1,6 @@ # Hangman Game -Hangman is an old school favorite, a word game where the goal is simply to find the missing word or words. You will be presented with a number of blank spaces representing the missing letters you need to find. Use the keyboard to guess a letter. +Hangman is an old school favorite, a word game where the goal is simply to find the missing word or words. You will be presented with a number of blank spaces representing the missing letters you need to find. Use the keyboard to guess a letter. ## Play Demographic @@ -11,30 +11,29 @@ Hangman is an old school favorite, a word game where the goal is simply to find - User: ANKITy102 - Gihub Link: https://github.com/ANKITy102 -- Blog: -- Video: +- Blog: +- Video: ## Implementation Details The Hangman game is structured around four major components, each designed for enhanced aesthetics and responsiveness using the Styled Components library: 1. Drawing.tsx -The Drawing.tsx component plays a crucial role in rendering the visual representation of the Hangman figure as the game progresses. It provides a visual cue to the player regarding their current progress and incorrect guesses. + The Drawing.tsx component plays a crucial role in rendering the visual representation of the Hangman figure as the game progresses. It provides a visual cue to the player regarding their current progress and incorrect guesses. 2. Word.tsx -The Word.tsx component is responsible for managing the user's input and displaying the correct answer. It ensures a seamless interaction between the player's guesses and the hidden word, providing real-time feedback on the correctness of their choices. + The Word.tsx component is responsible for managing the user's input and displaying the correct answer. It ensures a seamless interaction between the player's guesses and the hidden word, providing real-time feedback on the correctness of their choices. 3. Keyboard.tsx -The Keyboard.tsx component is designed to facilitate user input. It presents an interactive keyboard to players, allowing them to select letters as guesses. This component enhances the user experience by making it intuitive and straightforward to make guesses. + The Keyboard.tsx component is designed to facilitate user input. It presents an interactive keyboard to players, allowing them to select letters as guesses. This component enhances the user experience by making it intuitive and straightforward to make guesses. 4. Main.tsx -The Main.tsx component serves as the central hub where all other components are integrated, resulting in the complete Hangman game experience. It orchestrates the flow of the game, including initializing the game state, tracking guessed letters, and determining whether the player has won or lost. + The Main.tsx component serves as the central hub where all other components are integrated, resulting in the complete Hangman game experience. It orchestrates the flow of the game, including initializing the game state, tracking guessed letters, and determining whether the player has won or lost. In addition to these core components, the game relies on a wordList.json file, which contains a collection of hints and words used throughout the gameplay. These hints provide context to players and make the game more engaging and challenging. This modular and organized structure ensures that the Hangman game is not only enjoyable but also maintainable and extensible, making it an excellent showcase of best practices in React development. - ## Consideration Update all considerations(if any) diff --git a/src/plays/hangman-game/components/Drawing.tsx b/src/plays/hangman-game/components/Drawing.tsx index a6d75c7df..e57ccd0b1 100644 --- a/src/plays/hangman-game/components/Drawing.tsx +++ b/src/plays/hangman-game/components/Drawing.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import styled from 'styled-components'; + import { Head, Body, diff --git a/src/plays/hangman-game/components/Keyboard.tsx b/src/plays/hangman-game/components/Keyboard.tsx index 84b1bd5cb..e3350ae45 100644 --- a/src/plays/hangman-game/components/Keyboard.tsx +++ b/src/plays/hangman-game/components/Keyboard.tsx @@ -1,6 +1,5 @@ import { useEffect } from 'react'; import React from 'react'; -import styled from 'styled-components'; import { KEYS } from '../constants/constants'; import { Key, KeyboardGrid, KeyContainer } from '../styled-components'; diff --git a/src/plays/hangman-game/components/Word.tsx b/src/plays/hangman-game/components/Word.tsx index b25d22fdf..c2bb21a93 100644 --- a/src/plays/hangman-game/components/Word.tsx +++ b/src/plays/hangman-game/components/Word.tsx @@ -1,5 +1,4 @@ import React from 'react'; -import styled from 'styled-components'; import { Border, LetterComponent, WordContainer } from '../styled-components'; interface WordProps { diff --git a/src/plays/hangman-game/constants/constants.tsx b/src/plays/hangman-game/constants/constants.tsx index f2fb8c576..2179c09ee 100644 --- a/src/plays/hangman-game/constants/constants.tsx +++ b/src/plays/hangman-game/constants/constants.tsx @@ -1,5 +1,3 @@ -import React from 'react'; - export const KEYS = [ 'a', 'b', diff --git a/src/plays/hangman-game/styles.css b/src/plays/hangman-game/styles.css index f31432943..5fd508fa9 100644 --- a/src/plays/hangman-game/styles.css +++ b/src/plays/hangman-game/styles.css @@ -1,2 +1 @@ /* enter stlyes here */ - diff --git a/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx b/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx index 6dd7f9a10..0ae09c59b 100644 --- a/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx +++ b/src/plays/infinite-scroll-with-debouncing-concept/InfiniteScrollWithDebouncingConcept.jsx @@ -34,14 +34,14 @@ function InfiniteScrollWithDebouncingConcept(props) { return new Promise((resolve, reject) => { if (apiQuery) { try { - const promise = fetch( + fetch( 'https://openlibrary.org/search.json?' + new URLSearchParams({ q: apiQuery, page: pageNumber }) ).then((res) => { - const data = res.json().then((data) => { + res.json().then((data) => { resolve(); if (data.docs.length === 0) { setNoData(true); diff --git a/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx b/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx index 264cbd32b..3a45d978f 100644 --- a/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx +++ b/src/plays/multiplayer-tic-tac-toe/MultiplayerTicTacToe.tsx @@ -50,9 +50,10 @@ function MultiplayerTicTacToe(props: any) { if (pos === 'cross' || pos === 'circle') { count++; } - if (GAME_ARRAY.length === 9 && GAME_ARRAY.indexOf('') < 0) { + if (count > 9 || (GAME_ARRAY.length === 9 && GAME_ARRAY.indexOf('')) < 0) { setFinalMessage('Game Draw!'); setIsFinished(true); + count = 0; } }); diff --git a/src/plays/multiselect-component/styles.scss b/src/plays/multiselect-component/styles.scss index 4ccc3aee6..154b92b6a 100644 --- a/src/plays/multiselect-component/styles.scss +++ b/src/plays/multiselect-component/styles.scss @@ -9,7 +9,7 @@ $select-component-dropdown-max-height: 450px; #multi-select-component { width: $select-component-width; - margin-top: 100px; + margin-top: 100px; width: 100%; height: max-content; diff --git a/src/plays/object-detector/ObjectDetector.jsx b/src/plays/object-detector/ObjectDetector.jsx index 3223acd92..b89850229 100644 --- a/src/plays/object-detector/ObjectDetector.jsx +++ b/src/plays/object-detector/ObjectDetector.jsx @@ -1,6 +1,5 @@ import PlayHeader from 'common/playlists/PlayHeader'; import React, { useRef, useEffect } from 'react'; -import * as tf from '@tensorflow/tfjs'; import * as cocossd from '@tensorflow-models/coco-ssd'; import Webcam from 'react-webcam'; diff --git a/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx b/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx index 788b6cc5e..a508fb862 100644 --- a/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx +++ b/src/plays/random-quote-card-generator/Components/SideBarOperation.jsx @@ -109,7 +109,7 @@ const SideBarOperation = ({ // 2. Card Color Feature - const handleCardColor = (e) => { + const handleCardColor = () => { if (cardColor === 'Light') { setCardColor('Dark'); } else { diff --git a/src/plays/savings-calculator/components/SavingOptions/savingOptions.scss b/src/plays/savings-calculator/components/SavingOptions/savingOptions.scss index 722fc8f8b..2284956c4 100644 --- a/src/plays/savings-calculator/components/SavingOptions/savingOptions.scss +++ b/src/plays/savings-calculator/components/SavingOptions/savingOptions.scss @@ -1,4 +1,4 @@ -@import "../../styles/variables"; +@import '../../styles/variables'; .savingCalculator__savingOptions { padding-left: 100px; @@ -112,21 +112,20 @@ .savingOptions__radioInput:checked + label:before, .savingOptions__radioInput:not(:checked) + label:before { - content: ""; + content: ''; position: absolute; left: 0; top: 0; width: 18px; height: 18px; - box-shadow: 3px 3px 2px 2px rgba(0, 0, 0, 0.1), - -3px -3px 2px 2px rgba(255, 255, 255, 0.868); + box-shadow: 3px 3px 2px 2px rgba(0, 0, 0, 0.1), -3px -3px 2px 2px rgba(255, 255, 255, 0.868); border-radius: 100%; background: #fff; } .savingOptions__radioInput:checked + label:after, .savingOptions__radioInput:not(:checked) + label:after { - content: ""; + content: ''; width: 10px; height: 10px; background: $gradient; diff --git a/src/plays/savings-calculator/components/Total/total.scss b/src/plays/savings-calculator/components/Total/total.scss index 202397d01..85acb6ea0 100644 --- a/src/plays/savings-calculator/components/Total/total.scss +++ b/src/plays/savings-calculator/components/Total/total.scss @@ -1,4 +1,4 @@ -@import "../../styles/variables"; +@import '../../styles/variables'; .savingCalculator__total { text-align: center; diff --git a/src/plays/savings-calculator/styles/savingsCalculator.scss b/src/plays/savings-calculator/styles/savingsCalculator.scss index e1a0c40a4..a5536c316 100644 --- a/src/plays/savings-calculator/styles/savingsCalculator.scss +++ b/src/plays/savings-calculator/styles/savingsCalculator.scss @@ -1,4 +1,4 @@ -@import "./variables"; +@import './variables'; .savingsCalculator__container { display: flex; @@ -11,8 +11,7 @@ .savingsCalculator { display: flex; align-items: center; - box-shadow: 7px 7px 20px 5px rgba(0, 0, 0, 0.1), - -7px -7px 20px 5px rgba(255, 255, 255, 0.868); + box-shadow: 7px 7px 20px 5px rgba(0, 0, 0, 0.1), -7px -7px 20px 5px rgba(255, 255, 255, 0.868); border-radius: 16px; color: $text; padding: 4vh 3vw; diff --git a/src/plays/self-clicking-button/SelfClickingButton.jsx b/src/plays/self-clicking-button/SelfClickingButton.jsx index 5f9225596..30be0b49f 100644 --- a/src/plays/self-clicking-button/SelfClickingButton.jsx +++ b/src/plays/self-clicking-button/SelfClickingButton.jsx @@ -9,7 +9,7 @@ function SelfClickingButton(props) { const buttonRef = useRef(null); const [counter, setCounter] = useState(0); - function clickHandler(event) { + function clickHandler() { setCounter((prev) => prev + 1); } diff --git a/src/plays/tube2tunes/Tube2tunes.jsx b/src/plays/tube2tunes/Tube2tunes.jsx index 6d2f68651..0b2323626 100644 --- a/src/plays/tube2tunes/Tube2tunes.jsx +++ b/src/plays/tube2tunes/Tube2tunes.jsx @@ -57,7 +57,7 @@ function Tube2tunes(props) { setLoading(false); } }) - .catch((err) => { + .catch(() => { // console.log('Error: ', err); });