page for all videos
This commit is contained in:
parent
f03f879069
commit
a88aac19f1
59
src/App.tsx
59
src/App.tsx
|
|
@ -1,34 +1,35 @@
|
|||
// Modules
|
||||
import { Routes, Route, useLocation } from "react-router-dom";
|
||||
import { AnimatePresence } from "framer-motion";
|
||||
import ScrollToTop from "./hooks/ScrollToTop";
|
||||
import { Routes, Route, useLocation } from 'react-router-dom';
|
||||
import { AnimatePresence } from 'framer-motion';
|
||||
import ScrollToTop from './hooks/ScrollToTop';
|
||||
// import { changeLanguage } from "i18next";
|
||||
|
||||
// Styles
|
||||
import "swiper/swiper.css";
|
||||
import "swiper/css/pagination";
|
||||
import "swiper/css/navigation";
|
||||
import "react-lazy-load-image-component/src/effects/opacity.css";
|
||||
import "react-calendar/dist/Calendar.css";
|
||||
import "./styles/style.scss";
|
||||
import 'swiper/swiper.css';
|
||||
import 'swiper/css/pagination';
|
||||
import 'swiper/css/navigation';
|
||||
import 'react-lazy-load-image-component/src/effects/opacity.css';
|
||||
import 'react-calendar/dist/Calendar.css';
|
||||
import './styles/style.scss';
|
||||
|
||||
// Pages
|
||||
import Main from "./pages/Main";
|
||||
import NewsArticle from "./pages/NewsArticle";
|
||||
import Category from "./pages/Category";
|
||||
import SearchResult from "./pages/SearchResult";
|
||||
import AllPosts from "./pages/AllPosts";
|
||||
import NotFound404 from "./pages/NotFound404";
|
||||
import Main from './pages/Main';
|
||||
import NewsArticle from './pages/NewsArticle';
|
||||
import Category from './pages/Category';
|
||||
import SearchResult from './pages/SearchResult';
|
||||
import AllPosts from './pages/AllPosts';
|
||||
import NotFound404 from './pages/NotFound404';
|
||||
// import Video from './pages/Video';
|
||||
|
||||
// Components
|
||||
import Header from "./components/header/Header";
|
||||
import Footer from "./components/footer/Footer";
|
||||
import { Api } from "./api/Api";
|
||||
import { useEffect } from "react";
|
||||
import Header from './components/header/Header';
|
||||
import Footer from './components/footer/Footer';
|
||||
import { Api } from './api/Api';
|
||||
import { useEffect } from 'react';
|
||||
|
||||
const App = () => {
|
||||
const location = useLocation();
|
||||
const language = new Api("").language;
|
||||
const language = new Api('').language;
|
||||
|
||||
// useEffect(() => {
|
||||
// changeLanguage(language);
|
||||
|
|
@ -36,14 +37,14 @@ const App = () => {
|
|||
|
||||
useEffect(() => {
|
||||
try {
|
||||
const title = document.querySelector("title") as any;
|
||||
language === "EN"
|
||||
? (title.innerText = "Turkmenistan News Portal")
|
||||
: language === "RU"
|
||||
? (title.innerText = "Туркменистан новостной портал")
|
||||
: language === "TM"
|
||||
? (title.innerText = "Türkmenistan Habarlar Portaly")
|
||||
: "Türkmenistan Habarlar Portaly";
|
||||
const title = document.querySelector('title') as any;
|
||||
language === 'EN'
|
||||
? (title.innerText = 'Turkmenistan News Portal')
|
||||
: language === 'RU'
|
||||
? (title.innerText = 'Туркменистан новостной портал')
|
||||
: language === 'TM'
|
||||
? (title.innerText = 'Türkmenistan Habarlar Portaly')
|
||||
: 'Türkmenistan Habarlar Portaly';
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
}
|
||||
|
|
@ -59,7 +60,7 @@ const App = () => {
|
|||
<Route path="/category/:category" element={<Category />} />
|
||||
<Route path="/news/:id" element={<NewsArticle />} />
|
||||
<Route path="/search/:word" element={<SearchResult />} />
|
||||
<Route path="/all/:category" element={<AllPosts />} />
|
||||
<Route path="/all" element={<AllPosts />} />
|
||||
<Route path="*" element={<NotFound404 />} />
|
||||
</Routes>
|
||||
</AnimatePresence>
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ const NewsScroll = ({ title, category }: Props) => {
|
|||
{title === true ? (
|
||||
<SectionTitle
|
||||
title="Лента новостей"
|
||||
linkData={{ link: '/all/null', title: 'Посмотреть все' }}
|
||||
linkData={{ link: '/all', title: 'Посмотреть все' }}
|
||||
/>
|
||||
) : null}
|
||||
<div className="news-scroll-inner">
|
||||
|
|
|
|||
|
|
@ -38,21 +38,23 @@ const Videos = () => {
|
|||
<SectionTitle
|
||||
title="Видео"
|
||||
givenClass="videos"
|
||||
linkData={{ link: '/', title: 'Посмотреть все' }}
|
||||
linkData={{ link: '/all?type=video', title: 'Посмотреть все' }}
|
||||
/>
|
||||
<div className="videos-items">
|
||||
{data.map((videosDataItem) => {
|
||||
return (
|
||||
<VideosItem
|
||||
key={uuiv4()}
|
||||
url={videosDataItem.video || ''}
|
||||
placeholder={
|
||||
videosDataItem.featured_images[0] ? videosDataItem.featured_images[0].path : ''
|
||||
}
|
||||
date={videosDataItem.published_at}
|
||||
excerpt={videosDataItem.excerpt}
|
||||
/>
|
||||
);
|
||||
{data.map((videosDataItem, index) => {
|
||||
if (index <= 4) {
|
||||
return (
|
||||
<VideosItem
|
||||
key={uuiv4()}
|
||||
url={videosDataItem.video || ''}
|
||||
placeholder={
|
||||
videosDataItem.featured_images[0] ? videosDataItem.featured_images[0].path : ''
|
||||
}
|
||||
date={videosDataItem.published_at}
|
||||
excerpt={videosDataItem.excerpt}
|
||||
/>
|
||||
);
|
||||
}
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,52 +1,52 @@
|
|||
// Modules
|
||||
import { useState, useEffect } from "react";
|
||||
import { useParams } from "react-router-dom";
|
||||
import { useState, useEffect } from 'react';
|
||||
import { useSearchParams } from 'react-router-dom';
|
||||
|
||||
// Api
|
||||
import { Api } from "../api/Api";
|
||||
import { url } from "../url";
|
||||
import { Api } from '../api/Api';
|
||||
import { url } from '../url';
|
||||
|
||||
// Components
|
||||
import CustomNewsScroll from "../components/global/CustomNewsScroll";
|
||||
import Loader from "../components/global/Loader";
|
||||
import CustomNewsScroll from '../components/global/CustomNewsScroll';
|
||||
import Loader from '../components/global/Loader';
|
||||
|
||||
// Types
|
||||
import { IurlParamAdder } from "../types/api.types";
|
||||
import { IPostsData } from "../types/data.types";
|
||||
import { IurlParamAdder } from '../types/api.types';
|
||||
import { IPostsData } from '../types/data.types';
|
||||
import SectionTitle from '../components/global/SectionTitle';
|
||||
|
||||
const AllPosts = () => {
|
||||
const { category } = useParams();
|
||||
const categoryParam =
|
||||
category !== ("null" || undefined) ? (category as string) : "";
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
const type = searchParams.get('type') || null;
|
||||
|
||||
const [params, setParams] = useState<IurlParamAdder[]>(
|
||||
category !== ("null" || undefined)
|
||||
type !== null
|
||||
? [
|
||||
{
|
||||
name: "count",
|
||||
name: 'count',
|
||||
value: 10,
|
||||
},
|
||||
{
|
||||
name: "page",
|
||||
name: 'page',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
name: "category",
|
||||
value: categoryParam,
|
||||
name: 'type',
|
||||
value: type,
|
||||
},
|
||||
]
|
||||
: [
|
||||
{
|
||||
name: "count",
|
||||
name: 'count',
|
||||
value: 10,
|
||||
},
|
||||
{
|
||||
name: "page",
|
||||
name: 'page',
|
||||
value: 1,
|
||||
},
|
||||
]
|
||||
],
|
||||
);
|
||||
const api = new Api(url + "/posts", params);
|
||||
const api = new Api(url + '/posts', params);
|
||||
|
||||
const language = api.language;
|
||||
|
||||
|
|
@ -68,11 +68,8 @@ const AllPosts = () => {
|
|||
<main className="all">
|
||||
<div className="container">
|
||||
<div className="all-inner">
|
||||
{data ? (
|
||||
<CustomNewsScroll data={data} pagination={false} />
|
||||
) : (
|
||||
<Loader />
|
||||
)}
|
||||
{type === 'video' ? <SectionTitle title={'Видео'} /> : null}
|
||||
{data ? <CustomNewsScroll data={data} pagination={false} /> : <Loader />}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
|
|
|||
Loading…
Reference in New Issue