minor changes

package.json

@@ -52,7 +52,7 @@
     "@graphql-codegen/urql-introspection": "^2.2.1",
     "@graphql-tools/url-loader": "^7.17.3",
     "@graphql-typed-document-node/core": "^3.1.1",
-    "@nanostores/router": "^0.8.0",
+    "@nanostores/router": "^0.8.1",
     "@nanostores/solid": "^0.3.2",
     "@popperjs/core": "^2.11.6",
     "@solid-primitives/memo": "^1.1.3",

src/components/Article/FullArticle.tsx

@@ -16,6 +16,8 @@ import { CommentsTree } from './CommentsTree'
 import { useSession } from '../../context/session'
 import VideoPlayer from './VideoPlayer'
 import Slider from '../_shared/Slider'
+import { getPagePath } from '@nanostores/router'
+import { router } from '../../stores/router'
 
 interface ArticleProps {
   article: Shout
@@ -59,8 +61,6 @@ export const FullArticle = (props: ArticleProps) => {
       props.article.topics[0]
   )
 
-  const mainTopicTitle = createMemo(() => mainTopic().title.replace(' ', ' '))
-
   onMount(() => {
     const windowHash = window.location.hash
     if (windowHash?.length > 0) {
@@ -93,7 +93,9 @@ export const FullArticle = (props: ArticleProps) => {
       <article class="col-md-6 shift-content">
         <div class={styles.shoutHeader}>
           <div class={styles.shoutTopic}>
-            <a href={`/topic/${props.article.mainTopic}`} innerHTML={mainTopicTitle() || ''} />
+            <a href={`/topic/${props.article.mainTopic}`} class={styles.mainTopicLink}>
+              {mainTopic().title}
+            </a>
           </div>
 
           <h1>{props.article.title}</h1>
@@ -106,7 +108,7 @@ export const FullArticle = (props: ArticleProps) => {
               {(a: Author, index) => (
                 <>
                   <Show when={index() > 0}>, </Show>
-                  <a href={`/author/${a.slug}`}>{a.name}</a>
+                  <a href={getPagePath(router, 'author', { slug: a.slug })}>{a.name}</a>
                 </>
               )}
             </For>
@@ -210,7 +212,7 @@ export const FullArticle = (props: ArticleProps) => {
           <For each={props.article.topics}>
             {(topic) => (
               <div class={styles.shoutTopic}>
-                <a href={`/topic/${topic.slug}`}>{topic.title}</a>
+                <a href={getPagePath(router, 'topic', { slug: topic.slug })}>{topic.title}</a>
               </div>
             )}
           </For>

src/components/Nav/AuthModal/LoginForm.tsx

@@ -11,6 +11,7 @@ import type { AuthModalSearchParams } from './types'
 import { hideModal, locale } from '../../../stores/ui'
 import { useSession } from '../../../context/session'
 import { signSendLink } from '../../../stores/auth'
+import { useSnackbar } from '../../../context/snackbar'
 
 type FormFields = {
   email: string
@@ -27,6 +28,10 @@ export const LoginForm = () => {
   const [isEmailNotConfirmed, setIsEmailNotConfirmed] = createSignal(false)
   const [isLinkSent, setIsLinkSent] = createSignal(false)
 
+  const {
+    actions: { showSnackbar }
+  } = useSnackbar()
+
   const {
     actions: { signIn }
   } = useSession()
@@ -83,6 +88,7 @@ export const LoginForm = () => {
     try {
       await signIn({ email: email(), password: password() })
       hideModal()
+      showSnackbar({ body: t('Welcome!') })
     } catch (error) {
       if (error instanceof ApiError) {
         if (error.code === 'email_not_confirmed') {

src/context/session.tsx

@@ -3,6 +3,8 @@ import { createContext, createMemo, createResource, createSignal, onMount, useCo
 import type { AuthResult } from '../graphql/types.gen'
 import { apiClient } from '../utils/apiClient'
 import { resetToken, setToken } from '../graphql/privateGraphQLClient'
+import { t } from '../utils/intl'
+import { useSnackbar } from './snackbar'
 
 type SessionContextType = {
   session: Resource<AuthResult>
@@ -26,6 +28,10 @@ export function useSession() {
 export const SessionProvider = (props: { children: JSX.Element }) => {
   const [isSessionLoaded, setIsSessionLoaded] = createSignal(false)
 
+  const {
+    actions: { showSnackbar }
+  } = useSnackbar()
+
   const getSession = async (): Promise<AuthResult> => {
     try {
       const authResult = await apiClient.getSession()
@@ -63,7 +69,7 @@ export const SessionProvider = (props: { children: JSX.Element }) => {
     // TODO: call backend to revoke token
     mutate(null)
     resetToken()
-    console.debug('signed out')
+    showSnackbar({ body: t("You've successfully logged out") })
   }
 
   const confirmEmail = async (token: string) => {

src/locales/ru.json

@@ -229,5 +229,7 @@
   "Subscribe to comments": "Подписаться на комментарии",
   "Add to bookmarks": "Добавить в закладки",
   "Get notifications": "Получать уведомления",
-  "Profile successfully saved": "Профиль успешно сохранён"
+  "Profile successfully saved": "Профиль успешно сохранён",
+  "Welcome!": "Добро пожаловать!",
+  "You've successfully logged out": "Вы успешно вышли из аккаунта"
 }

src/styles/Article.module.scss

@@ -309,3 +309,7 @@ img {
     padding: 1.1rem 1.2rem 0.9rem;
   }
 }
+
+.mainTopicLink {
+  white-space: nowrap;
+}