opt
This commit is contained in:
parent
e099423688
commit
ac3baf77a1
|
|
@ -1,20 +1,20 @@
|
|||
// Modules
|
||||
import axios from "axios";
|
||||
import { Dispatch, SetStateAction } from "react";
|
||||
import { DispatchProp, useSelector } from "react-redux";
|
||||
import axios from 'axios';
|
||||
import { Dispatch, SetStateAction } from 'react';
|
||||
import { DispatchProp, useSelector } from 'react-redux';
|
||||
|
||||
// Types
|
||||
import { IurlParamAdder } from "../types/api.types";
|
||||
import { RootState } from "../types/store.types";
|
||||
import { IurlParamAdder } from '../types/api.types';
|
||||
import { RootState } from '../types/store.types';
|
||||
|
||||
// Helpers
|
||||
import { urlParamAdder } from "../helpers/urlParamAdder";
|
||||
import { urlParamAdder } from '../helpers/urlParamAdder';
|
||||
|
||||
export class Api {
|
||||
private url: string = "";
|
||||
private url: string = '';
|
||||
private params?: IurlParamAdder[];
|
||||
public language = useSelector<RootState, RootState["language"]["title"]>(
|
||||
(state) => state.language.title
|
||||
public language = useSelector<RootState, RootState['language']['title']>(
|
||||
(state) => state.language.title,
|
||||
);
|
||||
|
||||
constructor(url: string, params?: IurlParamAdder[]) {
|
||||
|
|
@ -23,13 +23,7 @@ export class Api {
|
|||
}
|
||||
|
||||
get(state: any, setState: Dispatch<SetStateAction<any>>) {
|
||||
const locale = { name: "locale", value: this.language };
|
||||
if (
|
||||
this.url.match(
|
||||
"^(http(s)://.)[-a-zA-Z0-9@:%._+~#=]{2,256}.[a-z]{2,6}\b([-a-zA-Z0-9@:%_+.~#?&//=]*)$"
|
||||
)
|
||||
)
|
||||
throw new Error("Bad URL");
|
||||
const locale = { name: 'locale', value: this.language };
|
||||
axios
|
||||
.get(urlParamAdder(locale, this.url, this.params))
|
||||
.then((res) => {
|
||||
|
|
|
|||
|
|
@ -1,37 +1,37 @@
|
|||
// Modules
|
||||
import { useEffect, useState } from "react";
|
||||
import { v4 as uuidv4 } from "uuid";
|
||||
import { useSelector, useDispatch } from "react-redux";
|
||||
import { useEffect, useState } from 'react';
|
||||
import { v4 as uuidv4 } from 'uuid';
|
||||
import { useSelector, useDispatch } from 'react-redux';
|
||||
|
||||
// Components
|
||||
import News from "../news/News";
|
||||
import SectionTitle from "./SectionTitle";
|
||||
import Loader from "./Loader";
|
||||
import News from '../news/News';
|
||||
import SectionTitle from './SectionTitle';
|
||||
import Loader from './Loader';
|
||||
|
||||
// Api
|
||||
import { url } from "../../url";
|
||||
import { Api } from "../../api/Api";
|
||||
import { newsScrollParams } from "../../api/params";
|
||||
import { url } from '../../url';
|
||||
import { Api } from '../../api/Api';
|
||||
import { newsScrollParams } from '../../api/params';
|
||||
|
||||
// Types
|
||||
import { IPostsData } from "../../types/data.types";
|
||||
import { RootState } from "../../types/store.types";
|
||||
import { IPostsData } from '../../types/data.types';
|
||||
import { RootState } from '../../types/store.types';
|
||||
|
||||
// Actions
|
||||
import { setNewsScroll } from "../../actions/setData";
|
||||
import { setNewsScroll } from '../../actions/setData';
|
||||
|
||||
interface Props {
|
||||
title: boolean;
|
||||
}
|
||||
|
||||
const NewsScroll = ({ title }: Props) => {
|
||||
const api = new Api(url + "/posts", newsScrollParams);
|
||||
const api = new Api(url + '/posts', newsScrollParams);
|
||||
const language = api.language;
|
||||
const [lastLanguage, setLastLanguage] = useState<string>(language);
|
||||
|
||||
// redux
|
||||
const data = useSelector<RootState, RootState["newsScroll"]["data"]>(
|
||||
(state) => state.newsScroll.data
|
||||
const data = useSelector<RootState, RootState['newsScroll']['data']>(
|
||||
(state) => state.newsScroll.data,
|
||||
);
|
||||
const dispatch = useDispatch();
|
||||
|
||||
|
|
@ -47,13 +47,10 @@ const NewsScroll = ({ title }: Props) => {
|
|||
<SectionTitle title="Лента новостей" />
|
||||
<div className="news-scroll-wrapper">
|
||||
{title === true ? (
|
||||
<SectionTitle
|
||||
title="Лента новостей"
|
||||
linkData={{ link: "/", title: "Посмотреть все" }}
|
||||
/>
|
||||
<SectionTitle title="Лента новостей" linkData={{ link: '/', title: 'Посмотреть все' }} />
|
||||
) : null}
|
||||
<div className="news-scroll-inner">
|
||||
{data ? (
|
||||
{(data as IPostsData[])[0].id > -1 ? (
|
||||
(data as IPostsData[]).map((dataEl) => {
|
||||
return (
|
||||
<News
|
||||
|
|
|
|||
|
|
@ -1,21 +1,20 @@
|
|||
// Modules
|
||||
import { Link } from "react-router-dom";
|
||||
import { LazyLoadImage } from "react-lazy-load-image-component";
|
||||
import { v4 as uuidv4 } from "uuid";
|
||||
// Images
|
||||
import { ReactComponent as ArrRight } from "../../assets/icons/arrow-right.svg";
|
||||
import { Link } from 'react-router-dom';
|
||||
import { LazyLoadImage } from 'react-lazy-load-image-component';
|
||||
import { v4 as uuidv4 } from 'uuid';
|
||||
|
||||
// Components
|
||||
import NewsCategory from "../global/NewsCategory";
|
||||
import NewsDate from "../global/NewsDate";
|
||||
import { IPostsData } from "../../types/data.types";
|
||||
import NewsCategory from '../global/NewsCategory';
|
||||
import NewsDate from '../global/NewsDate';
|
||||
import { IPostsData } from '../../types/data.types';
|
||||
|
||||
interface Props {
|
||||
id: IPostsData["id"];
|
||||
title: IPostsData["title"];
|
||||
text: IPostsData["content_html"];
|
||||
categories: IPostsData["categories"];
|
||||
date: IPostsData["published_at"];
|
||||
img: IPostsData["featured_images"][0]["path"];
|
||||
id: IPostsData['id'];
|
||||
title: IPostsData['title'];
|
||||
text: IPostsData['content_html'];
|
||||
categories: IPostsData['categories'];
|
||||
date: IPostsData['published_at'];
|
||||
img: IPostsData['featured_images'][0]['path'];
|
||||
}
|
||||
|
||||
const News = ({ id, title, text, categories, date, img }: Props) => {
|
||||
|
|
@ -23,12 +22,7 @@ const News = ({ id, title, text, categories, date, img }: Props) => {
|
|||
<div className="news">
|
||||
<div className="news-wrapper">
|
||||
<Link to={`/news/${id}`} className="news-image">
|
||||
<LazyLoadImage
|
||||
src={img}
|
||||
alt="image"
|
||||
useIntersectionObserver
|
||||
effect="blur"
|
||||
/>
|
||||
<LazyLoadImage src={img} alt="image" useIntersectionObserver effect="blur" />
|
||||
</Link>
|
||||
<div className="news-info">
|
||||
<div className="news-info-inner">
|
||||
|
|
@ -38,23 +32,14 @@ const News = ({ id, title, text, categories, date, img }: Props) => {
|
|||
<div className="news-status">
|
||||
<div className="news-status-left">
|
||||
{categories.map((category) => {
|
||||
return (
|
||||
<NewsCategory
|
||||
key={uuidv4()}
|
||||
title={category.name}
|
||||
id={category.id}
|
||||
/>
|
||||
);
|
||||
return <NewsCategory key={uuidv4()} title={category.name} id={category.id} />;
|
||||
})}
|
||||
</div>
|
||||
<div className="news-status-right">
|
||||
<NewsDate date={date} />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="news-text"
|
||||
dangerouslySetInnerHTML={{ __html: text }}
|
||||
></div>
|
||||
<div className="news-text" dangerouslySetInnerHTML={{ __html: text }}></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue