From ec0551528d09ab35345aba254d5ce9cd8f04f1ab Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Sat, 19 Nov 2022 23:57:21 +0300 Subject: qs -> URLSearchParams --- vnext/src/ui/Feeds.js | 28 ++++++++++++---------------- vnext/src/ui/Post.js | 6 ++---- 2 files changed, 14 insertions(+), 20 deletions(-) (limited to 'vnext/src/ui') diff --git a/vnext/src/ui/Feeds.js b/vnext/src/ui/Feeds.js index 2019dffd..bd69155f 100644 --- a/vnext/src/ui/Feeds.js +++ b/vnext/src/ui/Feeds.js @@ -1,7 +1,6 @@ import { useState, useEffect } from 'react'; -import { Link, useLocation, useParams, Navigate } from 'react-router-dom'; +import { Link, useLocation, useParams, Navigate, useSearchParams } from 'react-router-dom'; -import qs from 'qs'; import dayjs from 'dayjs'; import utc from 'dayjs/plugin/utc'; dayjs.extend(utc); @@ -46,8 +45,7 @@ function RequireAuth({ children }) { * */ export function Discover() { - const location = useLocation(); - let search = qs.parse(location.search.substring(1)); + const search = useSearchParams(); const query = { baseUrl: '/api/messages', search: search, @@ -86,9 +84,9 @@ export function Discussions() { */ export function Blog() { const { user } = useParams(); - const location = useLocation(); + const params = useSearchParams(); const search = { - ...qs.parse(location.search.substring(1)), + ...params, uname: user }; const query = { @@ -169,24 +167,22 @@ function Feed({ query }) { tag: '' }); const [loading, setLoading] = useState(true); + const filter = useSearchParams(); useEffect(() => { setLoading(true); - const filter = location.search.substring(1); - let getPageParam = (pageParam, lastMessage, filterParams) => { + let getPageParam = (pageParam, lastMessage, /** @type { URLSearchParams } */ filterParams) => { const pageValue = pageParam === 'before_mid' ? lastMessage.mid : pageParam === 'page' ? (Number(filterParams.page) || 0) + 1 : dayjs.utc(lastMessage.updated).valueOf(); - let newFilter = { ...filterParams }; - newFilter[pageParam] = pageValue; - return `?${qs.stringify(newFilter)}`; + filterParams[pageParam] = pageValue; + return `?${filterParams.toString()}`; }; - const filterParams = qs.parse(filter); - let params = Object.assign({}, filterParams || {}, query.search || {}); + let params = { ...Object.fromEntries(filter), ...query.search }; let url = query.baseUrl; getMessages(url, params) .then(response => { const { data } = response; const { pageParam } = query; const lastMessage = data.slice(-1)[0] || {}; - const nextpage = getPageParam(pageParam, lastMessage, filterParams); + const nextpage = getPageParam(pageParam, lastMessage, new URLSearchParams(params)); document.body.scrollTop = 0; document.documentElement.scrollTop = 0; setState((prevState) => { @@ -194,7 +190,7 @@ function Feed({ query }) { ...prevState, msgs: data, nextpage: nextpage, - tag: qs.parse(location.search.substring(1))['tag'] || '' + tag: filter['tag'] || '' }; }); setLoading(false); @@ -206,7 +202,7 @@ function Feed({ query }) { }; }); }); - }, [location.search, query]); + }, [location.search, query, filter]); return (state.msgs.length > 0 ? (
{ diff --git a/vnext/src/ui/Post.js b/vnext/src/ui/Post.js index fbd55675..74b74ffc 100644 --- a/vnext/src/ui/Post.js +++ b/vnext/src/ui/Post.js @@ -1,7 +1,5 @@ import { useState } from 'react'; -import { useLocation, useNavigate } from 'react-router-dom'; - -import qs from 'qs'; +import { useLocation, useNavigate, useSearchParams } from 'react-router-dom'; import Button from './Button'; import MessageInput from './MessageInput'; @@ -19,7 +17,7 @@ export default function Post() { const [visitor] = useVisitor(); let draftMessage = (location.state || {}).data || {}; let [draft, setDraft] = useState(draftMessage.body); - let params = qs.parse(window.location.search.substring(1)); + let params = useSearchParams(); let postMessage = (template) => { const { attach, body } = template; const postAction = draftMessage.mid ? update(draftMessage.mid, 0, body) : post(body, attach); -- cgit v1.2.3