From b84e7f43f7aea6727466c21100a53243035cbe72 Mon Sep 17 00:00:00 2001 From: Ilya Y <75578537+ilya-bkv@users.noreply.github.com> Date: Mon, 25 Mar 2024 16:07:14 +0300 Subject: [PATCH 01/11] Fix reload page after foute from profile to another profile (#430) --- src/components/Views/Author/Author.tsx | 10 ++++------ src/pages/author.page.tsx | 8 +------- src/utils/getImageUrl.ts | 20 ++++++++++---------- 3 files changed, 15 insertions(+), 23 deletions(-) diff --git a/src/components/Views/Author/Author.tsx b/src/components/Views/Author/Author.tsx index a21cebcc..c7515382 100644 --- a/src/components/Views/Author/Author.tsx +++ b/src/components/Views/Author/Author.tsx @@ -29,8 +29,6 @@ import stylesArticle from '../../Article/Article.module.scss' import styles from './Author.module.scss' type Props = { - shouts: Shout[] - author: Author authorSlug: string } export const PRERENDERED_ARTICLES_COUNT = 12 @@ -39,8 +37,8 @@ const LOAD_MORE_PAGE_SIZE = 9 export const AuthorView = (props: Props) => { const { t } = useLocalize() const { loadSubscriptions } = useFollowing() - const { sortedArticles } = useArticlesStore({ shouts: props.shouts }) - const { authorEntities } = useAuthorsStore({ authors: [props.author] }) + const { sortedArticles } = useArticlesStore() + const { authorEntities } = useAuthorsStore() const { page: getPage, searchParams } = useRouter() const [isLoadMoreButtonVisible, setIsLoadMoreButtonVisible] = createSignal(false) const [isBioExpanded, setIsBioExpanded] = createSignal(false) @@ -200,10 +198,10 @@ export const AuthorView = (props: Props) => {
- +
{t('All posts rating')} - +
diff --git a/src/pages/author.page.tsx b/src/pages/author.page.tsx index 39c4dc28..e23f92d3 100644 --- a/src/pages/author.page.tsx +++ b/src/pages/author.page.tsx @@ -56,17 +56,11 @@ export const AuthorPage = (props: PageProps) => { onCleanup(() => resetSortedArticles()) - const usePrerenderedData = props.author?.slug === slug() - return ( }> - + diff --git a/src/utils/getImageUrl.ts b/src/utils/getImageUrl.ts index 7b8b56dc..bc3c9073 100644 --- a/src/utils/getImageUrl.ts +++ b/src/utils/getImageUrl.ts @@ -15,17 +15,17 @@ export const getImageUrl = ( src: string, options: { width?: number; height?: number; noSizeUrlPart?: boolean } = {}, ) => { - if (!src.includes('discours.io') && src.includes('http')) { - return src - } - const filename = src.toLowerCase().split('/').pop() - const ext = filename.split('.').pop() - const isAudio = ext in ['wav', 'mp3', 'ogg', 'aif', 'flac'] - const base = isAudio ? cdnUrl : `${thumborUrl}/unsafe/` - const suffix = isAudio || options.noSizeUrlPart ? '' : getSizeUrlPart(options) - const subfolder = isAudio ? 'audio' : 'image' + if (!src.includes('discours.io') && src.includes('http')) { + return src + } + const filename = src.toLowerCase().split('/').pop() + const ext = filename.split('.').pop() + const isAudio = ext in ['wav', 'mp3', 'ogg', 'aif', 'flac'] + const base = isAudio ? cdnUrl : `${thumborUrl}/unsafe/` + const suffix = isAudio || options.noSizeUrlPart ? '' : getSizeUrlPart(options) + const subfolder = isAudio ? 'audio' : 'image' - return `${base}${suffix}production/${subfolder}/${filename}` + return `${base}${suffix}production/${subfolder}/${filename}` } export const getOpenGraphImageUrl = ( From ddaed0557d3e862aecc18133abb1d0e7d1ddf635 Mon Sep 17 00:00:00 2001 From: kvakazyambra Date: Tue, 26 Mar 2024 16:57:24 +0300 Subject: [PATCH 02/11] Fixed topic body render (#429) Fixed topic body render --- src/components/Topic/Full.tsx | 2 +- src/components/Topic/TopicBadge/TopicBadge.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Topic/Full.tsx b/src/components/Topic/Full.tsx index 492a9113..5e22aed1 100644 --- a/src/components/Topic/Full.tsx +++ b/src/components/Topic/Full.tsx @@ -40,7 +40,7 @@ export const FullTopic = (props: Props) => { return (

#{props.topic?.title}

-

{props.topic?.body}

+

} > -
{props.topic.body}
+
From 78dd43a497cf51240f3717db3f781fdd0d74ba61 Mon Sep 17 00:00:00 2001 From: Ilya Y <75578537+ilya-bkv@users.noreply.github.com> Date: Wed, 27 Mar 2024 03:54:15 +0300 Subject: [PATCH 03/11] Fix expo article length (#431) --- src/components/Views/Expo/Expo.tsx | 39 +++++++++++++----------------- 1 file changed, 17 insertions(+), 22 deletions(-) diff --git a/src/components/Views/Expo/Expo.tsx b/src/components/Views/Expo/Expo.tsx index eddd12a4..7cc5ee6a 100644 --- a/src/components/Views/Expo/Expo.tsx +++ b/src/components/Views/Expo/Expo.tsx @@ -24,8 +24,8 @@ type Props = { layout: LayoutType } -export const PRERENDERED_ARTICLES_COUNT = 37 -const LOAD_MORE_PAGE_SIZE = 11 +export const PRERENDERED_ARTICLES_COUNT = 36 +const LOAD_MORE_PAGE_SIZE = 12 export const Expo = (props: Props) => { const [isLoaded, setIsLoaded] = createSignal(Boolean(props.shouts)) @@ -34,11 +34,10 @@ export const Expo = (props: Props) => { const [randomTopArticles, setRandomTopArticles] = createSignal([]) const [randomTopMonthArticles, setRandomTopMonthArticles] = createSignal([]) + console.log('%c!!! randomTopMonthArticles():', 'color: #bada55', randomTopMonthArticles()) + const { t } = useLocalize() - // const { sortedArticles } = useArticlesStore({ - // shouts: isLoaded() ? props.shouts : [], - // }) const { sortedArticles } = useArticlesStore({ shouts: props.shouts || [], layout: props.layout, @@ -84,7 +83,7 @@ export const Expo = (props: Props) => { limit: 10, random_limit: 100, } - + console.log('%c!!! options:', 'color: #bada55', options) const result = await apiClient.getRandomTopShouts({ options }) setRandomTopArticles(result) } @@ -202,7 +201,7 @@ export const Expo = (props: Props) => {
- + {(shout) => (
{ 0} keyed={true}> - + {(shout) => (
{ 0} keyed={true}> - - {(page) => ( - - {(shout) => ( -
- -
- )} - + + {(shout) => ( +
+ +
)}
From 0b88357f7ce0f490ca889cb4a932e191a3cc46fc Mon Sep 17 00:00:00 2001 From: ilya-bkv Date: Fri, 29 Mar 2024 12:30:38 +0300 Subject: [PATCH 04/11] Fix expo --- src/components/Views/Expo/Expo.tsx | 10 ++++------ src/components/Views/Topic.tsx | 3 +-- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/src/components/Views/Expo/Expo.tsx b/src/components/Views/Expo/Expo.tsx index 7cc5ee6a..b161660a 100644 --- a/src/components/Views/Expo/Expo.tsx +++ b/src/components/Views/Expo/Expo.tsx @@ -26,6 +26,7 @@ type Props = { export const PRERENDERED_ARTICLES_COUNT = 36 const LOAD_MORE_PAGE_SIZE = 12 +const PARTIAL_PAGE_SIZE = 8 export const Expo = (props: Props) => { const [isLoaded, setIsLoaded] = createSignal(Boolean(props.shouts)) @@ -34,8 +35,6 @@ export const Expo = (props: Props) => { const [randomTopArticles, setRandomTopArticles] = createSignal([]) const [randomTopMonthArticles, setRandomTopMonthArticles] = createSignal([]) - console.log('%c!!! randomTopMonthArticles():', 'color: #bada55', randomTopMonthArticles()) - const { t } = useLocalize() const { sortedArticles } = useArticlesStore({ @@ -50,7 +49,7 @@ export const Expo = (props: Props) => { if (props.layout) { filters.layouts.push(props.layout) } else { - filters.layouts.push('article') + filters.layouts.push('audio', 'video', 'image', 'literature') } return filters @@ -83,7 +82,6 @@ export const Expo = (props: Props) => { limit: 10, random_limit: 100, } - console.log('%c!!! options:', 'color: #bada55', options) const result = await apiClient.getRandomTopShouts({ options }) setRandomTopArticles(result) } @@ -201,7 +199,7 @@ export const Expo = (props: Props) => {
- + {(shout) => (
{ 0} keyed={true}> - + {(shout) => (
{ /> - { 15}> - + From 75d929efdaa725ca4de37dd132617420df016c4d Mon Sep 17 00:00:00 2001 From: ilya-bkv Date: Fri, 29 Mar 2024 12:35:01 +0300 Subject: [PATCH 05/11] Fix expo --- src/components/Views/Expo/Expo.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/components/Views/Expo/Expo.tsx b/src/components/Views/Expo/Expo.tsx index b161660a..014af20f 100644 --- a/src/components/Views/Expo/Expo.tsx +++ b/src/components/Views/Expo/Expo.tsx @@ -26,7 +26,6 @@ type Props = { export const PRERENDERED_ARTICLES_COUNT = 36 const LOAD_MORE_PAGE_SIZE = 12 -const PARTIAL_PAGE_SIZE = 8 export const Expo = (props: Props) => { const [isLoaded, setIsLoaded] = createSignal(Boolean(props.shouts)) @@ -199,7 +198,7 @@ export const Expo = (props: Props) => {
- + {(shout) => (
{ 0} keyed={true}> - + {(shout) => (
{ 0} keyed={true}> - + {(shout) => (
Date: Fri, 29 Mar 2024 12:47:56 +0300 Subject: [PATCH 06/11] Fix expo types --- src/context/following.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/context/following.tsx b/src/context/following.tsx index f3208ca9..4076941b 100644 --- a/src/context/following.tsx +++ b/src/context/following.tsx @@ -2,10 +2,16 @@ import { Accessor, JSX, createContext, createEffect, createSignal, useContext } import { createStore } from 'solid-js/store' import { apiClient } from '../graphql/client/core' -import { AuthorFollows, FollowingEntity } from '../graphql/schema/core.gen' +import { Author, Community, FollowingEntity, Topic } from '../graphql/schema/core.gen' import { useSession } from './session' +type AuthorFollows = { + topics: Topic[] + authors: Author[] + communities: Community[] +} + interface FollowingContextType { loading: Accessor subscriptions: AuthorFollows From ce0c2c0f0ac17809f0717f92385f7c50a4df8639 Mon Sep 17 00:00:00 2001 From: ilya-bkv Date: Fri, 29 Mar 2024 12:58:32 +0300 Subject: [PATCH 07/11] Fix expo types --- src/context/following.tsx | 16 +++++----------- src/graphql/client/core.ts | 4 ++-- 2 files changed, 7 insertions(+), 13 deletions(-) diff --git a/src/context/following.tsx b/src/context/following.tsx index 4076941b..1b0aa059 100644 --- a/src/context/following.tsx +++ b/src/context/following.tsx @@ -2,20 +2,14 @@ import { Accessor, JSX, createContext, createEffect, createSignal, useContext } import { createStore } from 'solid-js/store' import { apiClient } from '../graphql/client/core' -import { Author, Community, FollowingEntity, Topic } from '../graphql/schema/core.gen' +import { AuthorFollowsResult, FollowingEntity } from '../graphql/schema/core.gen' import { useSession } from './session' -type AuthorFollows = { - topics: Topic[] - authors: Author[] - communities: Community[] -} - interface FollowingContextType { loading: Accessor - subscriptions: AuthorFollows - setSubscriptions: (subscriptions: AuthorFollows) => void + subscriptions: AuthorFollowsResult + setSubscriptions: (subscriptions: AuthorFollowsResult) => void setFollowing: (what: FollowingEntity, slug: string, value: boolean) => void loadSubscriptions: () => void follow: (what: FollowingEntity, slug: string) => Promise @@ -29,7 +23,7 @@ export function useFollowing() { return useContext(FollowingContext) } -const EMPTY_SUBSCRIPTIONS: AuthorFollows = { +const EMPTY_SUBSCRIPTIONS: AuthorFollowsResult = { topics: [], authors: [], communities: [], @@ -37,7 +31,7 @@ const EMPTY_SUBSCRIPTIONS: AuthorFollows = { export const FollowingProvider = (props: { children: JSX.Element }) => { const [loading, setLoading] = createSignal(false) - const [subscriptions, setSubscriptions] = createStore(EMPTY_SUBSCRIPTIONS) + const [subscriptions, setSubscriptions] = createStore(EMPTY_SUBSCRIPTIONS) const { author, session } = useSession() const fetchData = async () => { diff --git a/src/graphql/client/core.ts b/src/graphql/client/core.ts index e7d8708e..e80f2e6d 100644 --- a/src/graphql/client/core.ts +++ b/src/graphql/client/core.ts @@ -1,6 +1,6 @@ import type { Author, - AuthorFollows, + AuthorFollowsResult, CommonResult, FollowingEntity, LoadShoutsOptions, @@ -134,7 +134,7 @@ export const apiClient = { slug?: string author_id?: number user?: string - }): Promise => { + }): Promise => { const response = await publicGraphQLClient.query(authorFollows, params).toPromise() return response.data.get_author_follows }, From 5e5693332ce9586229aa6443293d2489640aa114 Mon Sep 17 00:00:00 2001 From: ilya-bkv Date: Fri, 29 Mar 2024 16:53:26 +0300 Subject: [PATCH 08/11] Load more fix --- src/components/Views/Expo/Expo.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Views/Expo/Expo.tsx b/src/components/Views/Expo/Expo.tsx index 014af20f..902f9dd9 100644 --- a/src/components/Views/Expo/Expo.tsx +++ b/src/components/Views/Expo/Expo.tsx @@ -37,7 +37,7 @@ export const Expo = (props: Props) => { const { t } = useLocalize() const { sortedArticles } = useArticlesStore({ - shouts: props.shouts || [], + shouts: isLoaded() ? props.shouts : [], layout: props.layout, }) @@ -228,7 +228,7 @@ export const Expo = (props: Props) => { 0} keyed={true}> - + {(shout) => (
Date: Fri, 29 Mar 2024 20:25:07 +0300 Subject: [PATCH 09/11] Fix Topic Top Articles --- src/components/Views/Expo/Expo.tsx | 35 +++++++++--------- src/components/Views/Topic.tsx | 58 +++++++++++++++++++++++++++--- 2 files changed, 69 insertions(+), 24 deletions(-) diff --git a/src/components/Views/Expo/Expo.tsx b/src/components/Views/Expo/Expo.tsx index 902f9dd9..cf30bfe3 100644 --- a/src/components/Views/Expo/Expo.tsx +++ b/src/components/Views/Expo/Expo.tsx @@ -31,8 +31,8 @@ export const Expo = (props: Props) => { const [isLoaded, setIsLoaded] = createSignal(Boolean(props.shouts)) const [isLoadMoreButtonVisible, setIsLoadMoreButtonVisible] = createSignal(false) - const [randomTopArticles, setRandomTopArticles] = createSignal([]) - const [randomTopMonthArticles, setRandomTopMonthArticles] = createSignal([]) + const [favoriteTopArticles, setFavoriteTopArticles] = createSignal([]) + const [reactedTopMonthArticles, setReactedTopMonthArticles] = createSignal([]) const { t } = useLocalize() @@ -42,7 +42,7 @@ export const Expo = (props: Props) => { }) const getLoadShoutsFilters = (additionalFilters: LoadShoutsFilters = {}): LoadShoutsFilters => { - const filters = { featured: true, ...additionalFilters } + const filters = { ...additionalFilters } if (!filters.layouts) filters.layouts = [] if (props.layout) { @@ -77,12 +77,12 @@ export const Expo = (props: Props) => { const loadRandomTopArticles = async () => { const options: LoadShoutsOptions = { - filters: getLoadShoutsFilters(), + filters: { ...getLoadShoutsFilters(), featured: true }, limit: 10, random_limit: 100, } const result = await apiClient.getRandomTopShouts({ options }) - setRandomTopArticles(result) + setFavoriteTopArticles(result) } const loadRandomTopMonthArticles = async () => { @@ -90,19 +90,15 @@ export const Expo = (props: Props) => { const after = getUnixtime(new Date(now.setMonth(now.getMonth() - 1))) const options: LoadShoutsOptions = { - filters: getLoadShoutsFilters({ after }), + filters: { ...getLoadShoutsFilters({ after }), reacted: true }, limit: 10, random_limit: 10, } const result = await apiClient.getRandomTopShouts({ options }) - setRandomTopMonthArticles(result) + setReactedTopMonthArticles(result) } - const pages = createMemo(() => - splitToPages(sortedArticles(), PRERENDERED_ARTICLES_COUNT, LOAD_MORE_PAGE_SIZE), - ) - onMount(() => { if (isLoaded()) { return @@ -126,8 +122,8 @@ export const Expo = (props: Props) => { () => props.layout, () => { resetSortedArticles() - setRandomTopArticles([]) - setRandomTopMonthArticles([]) + setFavoriteTopArticles([]) + setReactedTopMonthArticles([]) loadMore(PRERENDERED_ARTICLES_COUNT + LOAD_MORE_PAGE_SIZE) loadRandomTopArticles() loadRandomTopMonthArticles() @@ -140,8 +136,9 @@ export const Expo = (props: Props) => { }) const handleLoadMoreClick = () => { - loadMoreWithoutScrolling(LOAD_MORE_PAGE_SIZE) - } + loadMoreWithoutScrolling(LOAD_MORE_PAGE_SIZE); + }; + return (
@@ -210,8 +207,8 @@ export const Expo = (props: Props) => {
)} - 0} keyed={true}> - + 0} keyed={true}> + {(shout) => ( @@ -225,8 +222,8 @@ export const Expo = (props: Props) => {
)} - 0} keyed={true}> - + 0} keyed={true}> + {(shout) => ( diff --git a/src/components/Views/Topic.tsx b/src/components/Views/Topic.tsx index 64fae425..e257db39 100644 --- a/src/components/Views/Topic.tsx +++ b/src/components/Views/Topic.tsx @@ -1,8 +1,8 @@ -import type { Shout, Topic } from '../../graphql/schema/core.gen' +import { LoadShoutsOptions, Shout, Topic } from "../../graphql/schema/core.gen"; import { Meta } from '@solidjs/meta' import { clsx } from 'clsx' -import { For, Show, createEffect, createMemo, createSignal, onMount } from 'solid-js' +import { For, Show, createEffect, createMemo, createSignal, onMount, on } from "solid-js"; import { useLocalize } from '../../context/localize' import { useRouter } from '../../stores/router' @@ -22,6 +22,8 @@ import { FullTopic } from '../Topic/Full' import { ArticleCardSwiper } from '../_shared/SolidSwiper/ArticleCardSwiper' import styles from '../../styles/Topic.module.scss' +import { apiClient } from "../../graphql/client/core"; +import { getUnixtime } from "../../utils/getServerDate"; type TopicsPageSearchParams = { by: 'comments' | '' | 'recent' | 'viewed' | 'rating' | 'commented' @@ -43,14 +45,57 @@ export const TopicView = (props: Props) => { const { sortedArticles } = useArticlesStore({ shouts: props.shouts }) const { topicEntities } = useTopicsStore({ topics: [props.topic] }) const { authorsByTopic } = useAuthorsStore() + const [favoriteTopArticles, setFavoriteTopArticles] = createSignal([]) + const [reactedTopMonthArticles, setReactedTopMonthArticles] = createSignal([]) + + + console.log('%c!!! :', 'color: #bada55', sortedArticles()) const [topic, setTopic] = createSignal() + createEffect(() => { const topics = topicEntities() if (props.topicSlug && !topic() && topics) { setTopic(topics[props.topicSlug]) } }) + + const loadRandomTopArticles = async (topic: string) => { + const options: LoadShoutsOptions = { + filters: { featured: true, topic: topic}, + limit: 10, + random_limit: 100, + } + const result = await apiClient.getRandomTopShouts({ options }) + setFavoriteTopArticles(result) + } + + const loadRandomTopMonthArticles = async (topic: string) => { + const now = new Date() + const after = getUnixtime(new Date(now.setMonth(now.getMonth() - 1))) + + const options: LoadShoutsOptions = { + filters: { after: after, featured: true, topic: topic }, + limit: 10, + random_limit: 10, + } + + const result = await apiClient.getRandomTopShouts({ options }) + setReactedTopMonthArticles(result) + } + + + createEffect( + on( + () => topic(), + () => { + loadRandomTopArticles(topic()?.slug) + loadRandomTopMonthArticles(topic()?.slug) + }, + { defer: true }, + ), + ) + const title = createMemo( () => `#${capitalize( @@ -170,8 +215,9 @@ export const TopicView = (props: Props) => { beside={sortedArticles()[4]} wrapper={'author'} /> - - + 0} keyed={true}> + + { + 0} keyed={true}> + + 15}> - From d5aa083a2f1896b20eb4f6d9328cf82c323479aa Mon Sep 17 00:00:00 2001 From: ilya-bkv Date: Fri, 29 Mar 2024 20:25:17 +0300 Subject: [PATCH 10/11] Fix Topic Top Articles --- src/components/Views/Expo/Expo.tsx | 5 ++--- src/components/Views/Topic.tsx | 12 +++++------- 2 files changed, 7 insertions(+), 10 deletions(-) diff --git a/src/components/Views/Expo/Expo.tsx b/src/components/Views/Expo/Expo.tsx index cf30bfe3..82e43dfe 100644 --- a/src/components/Views/Expo/Expo.tsx +++ b/src/components/Views/Expo/Expo.tsx @@ -136,9 +136,8 @@ export const Expo = (props: Props) => { }) const handleLoadMoreClick = () => { - loadMoreWithoutScrolling(LOAD_MORE_PAGE_SIZE); - }; - + loadMoreWithoutScrolling(LOAD_MORE_PAGE_SIZE) + } return (
diff --git a/src/components/Views/Topic.tsx b/src/components/Views/Topic.tsx index e257db39..e3a512e1 100644 --- a/src/components/Views/Topic.tsx +++ b/src/components/Views/Topic.tsx @@ -1,8 +1,8 @@ -import { LoadShoutsOptions, Shout, Topic } from "../../graphql/schema/core.gen"; +import { LoadShoutsOptions, Shout, Topic } from '../../graphql/schema/core.gen' import { Meta } from '@solidjs/meta' import { clsx } from 'clsx' -import { For, Show, createEffect, createMemo, createSignal, onMount, on } from "solid-js"; +import { For, Show, createEffect, createMemo, createSignal, on, onMount } from 'solid-js' import { useLocalize } from '../../context/localize' import { useRouter } from '../../stores/router' @@ -21,9 +21,9 @@ import { Row3 } from '../Feed/Row3' import { FullTopic } from '../Topic/Full' import { ArticleCardSwiper } from '../_shared/SolidSwiper/ArticleCardSwiper' +import { apiClient } from '../../graphql/client/core' import styles from '../../styles/Topic.module.scss' -import { apiClient } from "../../graphql/client/core"; -import { getUnixtime } from "../../utils/getServerDate"; +import { getUnixtime } from '../../utils/getServerDate' type TopicsPageSearchParams = { by: 'comments' | '' | 'recent' | 'viewed' | 'rating' | 'commented' @@ -48,7 +48,6 @@ export const TopicView = (props: Props) => { const [favoriteTopArticles, setFavoriteTopArticles] = createSignal([]) const [reactedTopMonthArticles, setReactedTopMonthArticles] = createSignal([]) - console.log('%c!!! :', 'color: #bada55', sortedArticles()) const [topic, setTopic] = createSignal() @@ -62,7 +61,7 @@ export const TopicView = (props: Props) => { const loadRandomTopArticles = async (topic: string) => { const options: LoadShoutsOptions = { - filters: { featured: true, topic: topic}, + filters: { featured: true, topic: topic }, limit: 10, random_limit: 100, } @@ -84,7 +83,6 @@ export const TopicView = (props: Props) => { setReactedTopMonthArticles(result) } - createEffect( on( () => topic(), From 9d5ddcfccc41db44e8ff3d92685100f45a9587a1 Mon Sep 17 00:00:00 2001 From: ilya-bkv Date: Mon, 1 Apr 2024 07:16:53 +0300 Subject: [PATCH 11/11] Show saving status in ProfileSettings --- src/components/ProfileSettings/ProfileSettings.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/src/components/ProfileSettings/ProfileSettings.tsx b/src/components/ProfileSettings/ProfileSettings.tsx index 70389ccb..1891ddeb 100644 --- a/src/components/ProfileSettings/ProfileSettings.tsx +++ b/src/components/ProfileSettings/ProfileSettings.tsx @@ -33,6 +33,7 @@ export const ProfileSettings = () => { const { t } = useLocalize() const [prevForm, setPrevForm] = createStore({}) const [isFormInitialized, setIsFormInitialized] = createSignal(false) + const [isSaving, setIsSaving] = createSignal(false) const [social, setSocial] = createSignal([]) const [addLinkForm, setAddLinkForm] = createSignal(false) const [incorrectUrl, setIncorrectUrl] = createSignal(false) @@ -70,16 +71,20 @@ export const ProfileSettings = () => { const handleSubmit = async (event: Event) => { event.preventDefault() + setIsSaving(true) if (nameInputRef.current.value.length === 0) { setNameError(t('Required')) nameInputRef.current.focus() + setIsSaving(false) return } if (slugInputRef.current.value.length === 0) { setSlugError(t('Required')) slugInputRef.current.focus() + setIsSaving(false) return } + try { await submit(form) setPrevForm(clone(form)) @@ -91,6 +96,8 @@ export const ProfileSettings = () => { return } showSnackbar({ type: 'error', body: t('Error') }) + } finally { + setIsSaving(false) } await loadAuthor() // renews author's profile @@ -359,7 +366,12 @@ export const ProfileSettings = () => { } onClick={handleCancel} /> -