Browse Source

fix bugs

main
matthew 2 years ago
parent
commit
ecca4038b3
  1. 33
      searching-front/app/core/components/Footer/Footer.tsx
  2. 19
      searching-front/app/core/components/Footer/styles.module.css
  3. 9
      searching-front/app/core/components/SearchForm/SearchForm.tsx
  4. 3
      searching-front/app/core/helpers/metrika.ts
  5. 10
      searching-front/app/core/pages/Search/Search.tsx
  6. 4
      searching-front/app/i18n/en.ts
  7. 4
      searching-front/app/i18n/ru.ts
  8. 32
      searching-front/pages/_document.tsx

33
searching-front/app/core/components/Footer/Footer.tsx

@ -1,4 +1,5 @@
import { Routes } from "@blitzjs/next" import { Routes } from "@blitzjs/next"
import { count } from "app/core/helpers/metrika"
import TonLogo from "app/core/icons/TonLogo" import TonLogo from "app/core/icons/TonLogo"
import { useRouter } from "next/router" import { useRouter } from "next/router"
import { useTranslation } from "react-i18next" import { useTranslation } from "react-i18next"
@ -7,20 +8,38 @@ import ThemeSwitcher from "../ThemeSwitcher/ThemeSwitcher"
import s from "./styles.module.css" import s from "./styles.module.css"
import TGLogo from "./TGLogo" import TGLogo from "./TGLogo"
const Header = () => {
const { route } = useRouter()
const router = useRouter() interface FooterLinkProps {
href: string;
keyLink: string;
isTg?: boolean;
}
const FooterLink = ({href,keyLink,isTg}:FooterLinkProps) => {
const { t } = useTranslation()
const onClick =() => {
count(keyLink)
}
return (
<a onClick={onClick} target="_blank" href={href} className={s.footerLinkRoot}>
{isTg && <TGLogo className={s.tgIcon}/>} {t(keyLink)}
</a>
)
}
const Footer = () => {
const { t } = useTranslation() const { t } = useTranslation()
return ( return (
<div className={s.root}> <div className={s.root}>
<div className={s.contactsWrapper} > <div className={s.contactsWrapper}>
<span>{t("footer.contacts-description")}</span> <FooterLink href="https://searching_ton.t.me/" keyLink="footer.linkContacts" isTg />
<a target="_blank" href="https://searching_ton.t.me/"><TGLogo className={s.tgIcon}/></a> <FooterLink href="https://searchington.t.me/" keyLink="footer.linkAnnouncments" isTg />
<FooterLink href="https://searching_ton_feedback_bot.t.me/" keyLink="footer.linkFeedback" isTg />
</div> </div>
</div> </div>
) )
} }
export default Header export default Footer

19
searching-front/app/core/components/Footer/styles.module.css

@ -3,14 +3,25 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.tgIcon { .tgIcon {
width: 25px; width: 10px;
height: 25px; height: 10px;
margin-top: 10px; margin-right: 5px;
} }
.contactsWrapper { .contactsWrapper {
flex: 1;
display: flex; display: flex;
flex-direction: column; justify-content: space-between;
align-items: center; align-items: center;
color: var(--text_secondary); color: var(--text_secondary);
max-width: 600px;
}
.footerLinkRoot {
text-decoration: none;
color: var(--text_secondary);
display: flex;
align-items: center;
} }

9
searching-front/app/core/components/SearchForm/SearchForm.tsx

@ -52,11 +52,15 @@ const SearchForm = () => {
setFocusedSuggestion(null) setFocusedSuggestion(null)
await router.push(Routes.SearchPage({ query })) await router.push(Routes.SearchPage({ query }))
} }
const filteredSuggestion = suggestions?.filter((item) => item.text !== value)
const shouldShowSuggestion = filteredSuggestion && !!filteredSuggestion.length
useKeyPressEvent("Enter", async () => { useKeyPressEvent("Enter", async () => {
if (inputIsFocused) { if (inputIsFocused) {
blurInput() blurInput()
if (filteredSuggestion?.length && suggestions && focusedSuggestion) { if (filteredSuggestion?.length && suggestions && focusedSuggestion) {
await onSubmit(suggestions[focusedSuggestion - 1]?.text) await onSubmit(filteredSuggestion[focusedSuggestion - 1]?.text)
} else { } else {
await onSubmit(value) await onSubmit(value)
} }
@ -111,9 +115,8 @@ const SearchForm = () => {
setInputFocused(true) setInputFocused(true)
}, []) }, [])
const filteredSuggestion = suggestions?.filter((item) => item.text !== value)
const shouldShowSuggestion = filteredSuggestion && !!filteredSuggestion.length
debugger
return ( return (
<AnimatePresence> <AnimatePresence>
<motion.div layoutId="searchForm" className={s.root}> <motion.div layoutId="searchForm" className={s.root}>

3
searching-front/app/core/helpers/metrika.ts

@ -0,0 +1,3 @@
export const count = (event:string) => {
yaCounter90644479.reachGoal(event)
}

10
searching-front/app/core/pages/Search/Search.tsx

@ -5,17 +5,18 @@ import WebsiteCard from "app/core/components/WebsiteCard"
import getSearchResult from "app/search-requests/queries/getSearchResult" import getSearchResult from "app/search-requests/queries/getSearchResult"
import { useRouter } from "next/router" import { useRouter } from "next/router"
import { useState } from "react" import { useState } from "react"
import { useTranslation } from "react-i18next"
import ReactPaginate from "react-paginate" import ReactPaginate from "react-paginate"
import s from "./styles.module.css" import s from "./styles.module.css"
const Search = () => { const Search = () => {
const router = useRouter() const router = useRouter()
const {t} = useTranslation()
const [page, setPage] = useState(0) const [page, setPage] = useState(0)
const text = router.query.query as string;
const [res] = useQuery( const [res] = useQuery(
getSearchResult, getSearchResult,
{ text: router.query.query as string, page }, { text, page },
{ suspense: false, keepPreviousData: true } { suspense: false, keepPreviousData: true }
) )
const onPageChange = (page: number) => { const onPageChange = (page: number) => {
@ -41,7 +42,8 @@ const Search = () => {
</div> </div>
) )
} else if (res && !res.hits.length) { } else if (res && !res.hits.length) {
return "not found" return <div>{t("searchPage.notFound")}<b>«{text}»</b></div>
} }
return "loading" return "loading"
} }

4
searching-front/app/i18n/en.ts

@ -2,7 +2,11 @@ const en = {
translation: { translation: {
"search.placeholder": "Find your own ton", "search.placeholder": "Find your own ton",
"search.button": "Search", "search.button": "Search",
"searchPage.notFound": "No results found for ",
"footer.contacts-description": "Feedback, suggestions, bug reports", "footer.contacts-description": "Feedback, suggestions, bug reports",
"footer.linkContacts": "Contact Us",
"footer.linkAnnouncments": "Announcments",
"footer.linkFeedback": "Feedback",
}, },
} }

4
searching-front/app/i18n/ru.ts

@ -2,7 +2,11 @@ const ru = {
translation: { translation: {
"search.placeholder": "Найди свой собственный TON", "search.placeholder": "Найди свой собственный TON",
"search.button": "Найти", "search.button": "Найти",
"searchPage.notFound": "Ничего не найдено по запросу ",
"footer.contacts-description": "Отзывы, предложения, багрепорты", "footer.contacts-description": "Отзывы, предложения, багрепорты",
"footer.linkContacts": "Связаться с нами",
"footer.linkAnnouncments": "Новости",
"footer.linkFeedback": "Оставить обратную связь",
}, },
} }

32
searching-front/pages/_document.tsx

@ -11,10 +11,25 @@ class MyDocument extends Document {
<Html lang="en"> <Html lang="en">
<Head /> <Head />
<body> <body>
<Main /> <script async src="https://www.googletagmanager.com/gtag/js?id=G-DTHZT6R255"></script>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-DTHZT6R255"></script> <script
type="text/javascript"
dangerouslySetInnerHTML={{
__html: `
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-DTHZT6R255');
`,
}}
/>
<script type="text/javascript" dangerouslySetInnerHTML={{__html: ` <Main />
<script
type="text/javascript"
dangerouslySetInnerHTML={{
__html: `
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
m[i].l=1*new Date(); m[i].l=1*new Date();
for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
@ -22,8 +37,8 @@ class MyDocument extends Document {
(window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
ym(90644479, "init", { ym(90644479, "init", {
clickmap:true, clickmap:false,
trackLinks:true, trackLinks:false,
accurateTrackBounce:true accurateTrackBounce:true
}); });
window.dataLayer = window.dataLayer || []; window.dataLayer = window.dataLayer || [];
@ -31,10 +46,9 @@ class MyDocument extends Document {
gtag('js', new Date()); gtag('js', new Date());
gtag('config', 'G-DTHZT6R255'); gtag('config', 'G-DTHZT6R255');
`}} > `,
}}
</script> ></script>
<NextScript /> <NextScript />
<div id="modal-root"></div> <div id="modal-root"></div>

Loading…
Cancel
Save