From 5be5618f52a2fbaa836e98c1e1661bccd77efa64 Mon Sep 17 00:00:00 2001 From: sandeep Date: Thu, 2 Nov 2023 07:08:30 +0530 Subject: [PATCH 1/2] fix_issu_657_bug --- src/components/challenges/Index.jsx | 36 ++++++++++++++--------------- src/components/videos/Index.jsx | 6 ++--- src/database/challenges/css.json | 5 ++-- 3 files changed, 22 insertions(+), 25 deletions(-) diff --git a/src/components/challenges/Index.jsx b/src/components/challenges/Index.jsx index 88f2ad5..7ba546f 100644 --- a/src/components/challenges/Index.jsx +++ b/src/components/challenges/Index.jsx @@ -1,32 +1,30 @@ -import { useEffect, useState } from 'react'; -import Card from '../Card'; -import Filter from '../filter/index'; -import html from '../../database/challenges/html.json'; -import css from '../../database/challenges/css.json'; -import js from '../../database/challenges/javascript.json'; -import react from '../../database/challenges/reactjs.json'; -import tailwind from '../../database/challenges/tailwindcss.json'; -import nextjs from '../../database/challenges/nextjs.json'; +import { useEffect, useState } from "react"; +import Card from "../Card"; +import Filter from "../filter/index"; +import html from "../../database/challenges/html.json"; +import css from "../../database/challenges/css.json"; +import js from "../../database/challenges/javascript.json"; +import react from "../../database/challenges/reactjs.json"; +import tailwind from "../../database/challenges/tailwindcss.json"; +import nextjs from "../../database/challenges/nextjs.json"; import { useLocation } from "react-router-dom"; - const Index = () => { - const [filter, setFilter] = useState('html'); + const [filter, setFilter] = useState("html"); const [data, setData] = useState([]); const [searchData, setSearchData] = useState(); let location = useLocation(); - useEffect(() => { - if (filter === 'html') { + if (filter === "html") { setData([...html]); - } else if (filter === 'css') { + } else if (filter === "css") { setData([...css]); - } else if (filter === 'js') { + } else if (filter === "js") { setData([...js]); - } else if (filter === 'tailwind') { + } else if (filter === "tailwind") { setData([...tailwind]); - }else if (filter === 'nextjs') { + } else if (filter === "nextjs") { setData([...nextjs]); } else { setData([...react]); @@ -49,9 +47,9 @@ const Index = () => { }, [searchItem, data]); return ( -
+
-
+
{data.length > 0 ? ( (location.search !== "" ? searchData : data).map( (res, i) => diff --git a/src/components/videos/Index.jsx b/src/components/videos/Index.jsx index 18c3d65..1f78a0a 100644 --- a/src/components/videos/Index.jsx +++ b/src/components/videos/Index.jsx @@ -6,7 +6,7 @@ import css from "../../database/videos/css.json"; import js from "../../database/videos/javascript.json"; import react from "../../database/videos/reactjs.json"; import tailwind from "../../database/videos/tailwindcss.json"; -import nextjs from '../../database/videos/nextjs.json'; +import nextjs from "../../database/videos/nextjs.json"; import { useLocation } from "react-router-dom"; const Index = () => { @@ -15,7 +15,6 @@ const Index = () => { const [searchData, setSearchData] = useState(); let location = useLocation(); - useEffect(() => { if (filter === "html") { setData([...html]); @@ -27,7 +26,7 @@ const Index = () => { setData([...tailwind]); } else if (filter === "nextjs") { setData([...nextjs]); - } else { + } else { setData([...react]); } }, [filter]); @@ -36,7 +35,6 @@ const Index = () => { setFilter(target); }; - const index = location.search.indexOf("="); let searchItem = location.search.slice(index + 1); diff --git a/src/database/challenges/css.json b/src/database/challenges/css.json index d3416a6..15cfbfd 100644 --- a/src/database/challenges/css.json +++ b/src/database/challenges/css.json @@ -1,12 +1,14 @@ [ { "tag": "css", + "title": "NO Title", "description": "Improve your HTML and CSS skills by practicing on real design templates.With Codewell, you can browse high quality Figma templates that you can use to sharpen your HTML and CSS skills.", "link": "https://www.codewell.cc/", "img": "https://user-images.githubusercontent.com/100681165/238244473-00725538-ef4d-4ece-8fd7-11e6b999b895.png" }, { "tag": "css", + "title": "NO Title", "description": "CSS code-golfing game is here! Use your CSS skills to replicate targets with smallest possible code. Feel free to check out the targets below and put your CSS skills to test.", "link": "https://cssbattle.dev/", "img": "https://user-images.githubusercontent.com/100681165/238244467-6534a6f4-f996-4fef-893b-25eb2948e4f5.png" @@ -75,12 +77,11 @@ "img": "https://user-images.githubusercontent.com/80768852/258640252-d0d23766-894c-4d93-a75b-6f0cf85da29b.png" }, - { + { "tag": "css", "title": "CSS Battle", "description": "Replicate the target images using CSS - the shorter your code, the higher your score! Happy coding!", "link": "https://cssbattle.dev/", "img": "https://github.com/jayk-gupta/web-resources-project/assets/104543751/e32c7690-aec6-483d-ab7e-8584f25c5c17" - } ] From f1781cb0b3d23055e2efa68c5b9f546a82686b57 Mon Sep 17 00:00:00 2001 From: sandeep Date: Thu, 2 Nov 2023 07:41:12 +0530 Subject: [PATCH 2/2] issu 657 resolved --- src/components/challenges/Index.jsx | 36 +++++++++++++++-------------- src/components/videos/Index.jsx | 6 +++-- src/database/challenges/css.json | 5 ++-- 3 files changed, 25 insertions(+), 22 deletions(-) diff --git a/src/components/challenges/Index.jsx b/src/components/challenges/Index.jsx index 7ba546f..88f2ad5 100644 --- a/src/components/challenges/Index.jsx +++ b/src/components/challenges/Index.jsx @@ -1,30 +1,32 @@ -import { useEffect, useState } from "react"; -import Card from "../Card"; -import Filter from "../filter/index"; -import html from "../../database/challenges/html.json"; -import css from "../../database/challenges/css.json"; -import js from "../../database/challenges/javascript.json"; -import react from "../../database/challenges/reactjs.json"; -import tailwind from "../../database/challenges/tailwindcss.json"; -import nextjs from "../../database/challenges/nextjs.json"; +import { useEffect, useState } from 'react'; +import Card from '../Card'; +import Filter from '../filter/index'; +import html from '../../database/challenges/html.json'; +import css from '../../database/challenges/css.json'; +import js from '../../database/challenges/javascript.json'; +import react from '../../database/challenges/reactjs.json'; +import tailwind from '../../database/challenges/tailwindcss.json'; +import nextjs from '../../database/challenges/nextjs.json'; import { useLocation } from "react-router-dom"; + const Index = () => { - const [filter, setFilter] = useState("html"); + const [filter, setFilter] = useState('html'); const [data, setData] = useState([]); const [searchData, setSearchData] = useState(); let location = useLocation(); + useEffect(() => { - if (filter === "html") { + if (filter === 'html') { setData([...html]); - } else if (filter === "css") { + } else if (filter === 'css') { setData([...css]); - } else if (filter === "js") { + } else if (filter === 'js') { setData([...js]); - } else if (filter === "tailwind") { + } else if (filter === 'tailwind') { setData([...tailwind]); - } else if (filter === "nextjs") { + }else if (filter === 'nextjs') { setData([...nextjs]); } else { setData([...react]); @@ -47,9 +49,9 @@ const Index = () => { }, [searchItem, data]); return ( -
+
-
+
{data.length > 0 ? ( (location.search !== "" ? searchData : data).map( (res, i) => diff --git a/src/components/videos/Index.jsx b/src/components/videos/Index.jsx index 1f78a0a..18c3d65 100644 --- a/src/components/videos/Index.jsx +++ b/src/components/videos/Index.jsx @@ -6,7 +6,7 @@ import css from "../../database/videos/css.json"; import js from "../../database/videos/javascript.json"; import react from "../../database/videos/reactjs.json"; import tailwind from "../../database/videos/tailwindcss.json"; -import nextjs from "../../database/videos/nextjs.json"; +import nextjs from '../../database/videos/nextjs.json'; import { useLocation } from "react-router-dom"; const Index = () => { @@ -15,6 +15,7 @@ const Index = () => { const [searchData, setSearchData] = useState(); let location = useLocation(); + useEffect(() => { if (filter === "html") { setData([...html]); @@ -26,7 +27,7 @@ const Index = () => { setData([...tailwind]); } else if (filter === "nextjs") { setData([...nextjs]); - } else { + } else { setData([...react]); } }, [filter]); @@ -35,6 +36,7 @@ const Index = () => { setFilter(target); }; + const index = location.search.indexOf("="); let searchItem = location.search.slice(index + 1); diff --git a/src/database/challenges/css.json b/src/database/challenges/css.json index 15cfbfd..d3416a6 100644 --- a/src/database/challenges/css.json +++ b/src/database/challenges/css.json @@ -1,14 +1,12 @@ [ { "tag": "css", - "title": "NO Title", "description": "Improve your HTML and CSS skills by practicing on real design templates.With Codewell, you can browse high quality Figma templates that you can use to sharpen your HTML and CSS skills.", "link": "https://www.codewell.cc/", "img": "https://user-images.githubusercontent.com/100681165/238244473-00725538-ef4d-4ece-8fd7-11e6b999b895.png" }, { "tag": "css", - "title": "NO Title", "description": "CSS code-golfing game is here! Use your CSS skills to replicate targets with smallest possible code. Feel free to check out the targets below and put your CSS skills to test.", "link": "https://cssbattle.dev/", "img": "https://user-images.githubusercontent.com/100681165/238244467-6534a6f4-f996-4fef-893b-25eb2948e4f5.png" @@ -77,11 +75,12 @@ "img": "https://user-images.githubusercontent.com/80768852/258640252-d0d23766-894c-4d93-a75b-6f0cf85da29b.png" }, - { + { "tag": "css", "title": "CSS Battle", "description": "Replicate the target images using CSS - the shorter your code, the higher your score! Happy coding!", "link": "https://cssbattle.dev/", "img": "https://github.com/jayk-gupta/web-resources-project/assets/104543751/e32c7690-aec6-483d-ab7e-8584f25c5c17" + } ]