lint

astro.config.ts

@@ -12,7 +12,7 @@ const getDevCssClassPrefix = (filename: string): string => {
   return filename
     .slice(filename.indexOf(PATH_PREFIX) + PATH_PREFIX.length)
     .replace('.module.scss', '')
-    .replace(/[/?\\]/g, '-')
+    .replaceAll(/[/?\\]/g, '-')
 }
 
 const devGenerateScopedName = (name: string, filename: string, css: string) =>

src/components/Article/Comment.module.scss

@@ -54,6 +54,7 @@
 
 .commentControls {
   @include font-size(1.2rem);
+
   margin-bottom: 0.5em;
 }
 
@@ -120,6 +121,7 @@
 
 .commentBody {
   @include font-size(1.5rem);
+
   line-height: 1.47;
 }
 
@@ -196,6 +198,7 @@
 
   button {
     @include font-size(1.6rem);
+
     margin-left: 1.2rem;
   }
 }

src/components/Article/RatingControl.tsx

@@ -1,6 +1,5 @@
 import styles from './RatingControl.module.scss'
 import { clsx } from 'clsx'
-import { Icon } from '../_shared/Icon'
 
 interface RatingControlProps {
   rating?: number

src/components/Author/Card.module.scss

@@ -265,6 +265,7 @@
 .authorComments {
   .authorName {
     @include font-size(1.2rem);
+
     margin-bottom: 0;
   }
 

src/components/Inbox/CreateModalContent.module.scss

@@ -1,5 +1,6 @@
 .CreateModalContent {
   padding: 24px;
+
   .footer {
     padding-top: 12px;
     display: flex;

src/components/Inbox/DialogAvatar.module.scss

@@ -18,6 +18,7 @@
     border-radius: 50%;
     border: 3px solid #fff;
   }
+
   .imageHolder {
     background-size: cover;
     width: 100%;
@@ -29,9 +30,6 @@
   .letter {
     display: block;
     border-radius: 100%;
-  }
-
-  .letter {
     margin-bottom: -2px;
     font-weight: 500;
     font-size: 18px;

src/components/Inbox/DialogCard.tsx

@@ -1,4 +1,4 @@
-import { Show, Switch, Match, createMemo, For } from 'solid-js'
+import { Show, Switch, Match, createMemo } from 'solid-js'
 import DialogAvatar from './DialogAvatar'
 import type { ChatMember } from '../../graphql/types.gen'
 import GroupDialogAvatar from './GroupDialogAvatar'

src/components/Inbox/GroupDialogAvatar.module.scss

@@ -2,6 +2,7 @@
   position: relative;
   height: 40px;
   width: 40px;
+
   .grouped {
     position: absolute;
 

src/components/Inbox/Message.module.scss

@@ -20,6 +20,7 @@
     a {
       color: inherit;
       text-decoration: underline;
+
       &:hover {
         color: inherit;
       }
@@ -46,6 +47,7 @@
       line-height: 20px;
     }
   }
+
   &.own {
     .body {
       justify-content: flex-end;
@@ -54,6 +56,7 @@
       background: #000;
       color: #fff;
     }
+
     .time {
       text-align: right;
     }

src/components/Nav/HeaderAuth.tsx

@@ -3,7 +3,7 @@ import { clsx } from 'clsx'
 import { useRouter } from '../../stores/router'
 import { t } from '../../utils/intl'
 import { Icon } from '../_shared/Icon'
-import { createEffect, createSignal, Show } from 'solid-js'
+import { createSignal, Show } from 'solid-js'
 import Notifications from './Notifications'
 import { ProfilePopup } from './ProfilePopup'
 import Userpic from '../Author/Userpic'

src/components/Nav/Modal.tsx

@@ -17,7 +17,7 @@ interface ModalProps {
 export const Modal = (props: ModalProps) => {
   const { modal } = useModalStore()
 
-  const backdropClick = (event: Event) => {
+  const backdropClick = () => {
     hideModal()
   }
 

src/components/Pages/profile/ProfileSecurityPage.tsx

@@ -72,7 +72,7 @@ export const ProfileSecurityPage = (props: PageProps) => {
                 <h5>Google</h5>
                 <div class="pretty-form__item">
                   <p>
-                    <button class={clsx('button button--light', styles.socialButton)} type="button">
+                    <button class={clsx('button', 'button--light', styles.socialButton)} type="button">
                       <Icon name="google" class={styles.icon} />
                       Привязать
                     </button>
@@ -82,7 +82,7 @@ export const ProfileSecurityPage = (props: PageProps) => {
                 <h5>VK</h5>
                 <div class="pretty-form__item">
                   <p>
-                    <button class={clsx(styles.socialButton, 'button button--light')} type="button">
+                    <button class={clsx(styles.socialButton, 'button', 'button--light')} type="button">
                       <Icon name="vk" class={styles.icon} />
                       Привязать
                     </button>
@@ -92,7 +92,7 @@ export const ProfileSecurityPage = (props: PageProps) => {
                 <h5>Facebook</h5>
                 <div class="pretty-form__item">
                   <p>
-                    <button class={clsx(styles.socialButton, 'button button--light')} type="button">
+                    <button class={clsx(styles.socialButton, 'button', 'button--light')} type="button">
                       <Icon name="facebook" class={styles.icon} />
                       Привязать
                     </button>

src/components/Pages/profile/Settings.module.scss

@@ -9,6 +9,7 @@ h4 {
 
 h5 {
   @include font-size(1.7rem);
+
   margin: 0 0 0.8rem;
 }
 

src/components/Topic/Card.tsx

@@ -1,6 +1,6 @@
 import { capitalize } from '../../utils'
 import styles from './Card.module.scss'
-import { createEffect, createMemo, createSignal, Show } from 'solid-js'
+import { createMemo, createSignal, Show } from 'solid-js'
 import type { Topic } from '../../graphql/types.gen'
 import { FollowingEntity } from '../../graphql/types.gen'
 import { t } from '../../utils/intl'
@@ -8,7 +8,6 @@ import { follow, unfollow } from '../../stores/zine/common'
 import { getLogger } from '../../utils/logger'
 import { clsx } from 'clsx'
 import { useSession } from '../../context/session'
-import { StatMetrics } from '../_shared/StatMetrics'
 import { ShowOnlyOnClient } from '../_shared/ShowOnlyOnClient'
 
 const log = getLogger('TopicCard')

src/components/Views/Inbox.tsx

@@ -29,7 +29,7 @@ const userSearch = (array: Author[], keyword: string) => {
 export const InboxView = () => {
   const {
     chats,
-    actions: { loadChats, setListener }
+    actions: { loadChats } // setListener
   } = useInbox()
   const [messages, setMessages] = createSignal<MessageType[]>([])
   const [recipients, setRecipients] = createSignal<Author[]>([])

src/components/_shared/SearchField.tsx

@@ -1,7 +1,7 @@
 import styles from './SearchField.module.scss'
 import { Icon } from './Icon'
 import { t } from '../../utils/intl'
-import clsx from 'clsx'
+import { clsx } from 'clsx'
 
 type SearchFieldProps = {
   onChange: (value: string) => void

src/components/_shared/Slider.tsx

@@ -4,7 +4,7 @@ import 'swiper/scss'
 import 'swiper/scss/navigation'
 import 'swiper/scss/pagination'
 import './Slider.scss'
-import { createEffect, createMemo, createSignal, Show, For, JSX } from 'solid-js'
+import { createEffect, createSignal, JSX } from 'solid-js'
 import { Icon } from './Icon'
 
 interface SliderProps {

src/graphql/privateGraphQLClient.ts

@@ -8,18 +8,18 @@ import {
 } from '@urql/core'
 // import { createClient as createSSEClient } from 'graphql-sse'
 import { createClient as createWSClient } from 'graphql-ws'
-// import { devtoolsExchange } from '@urql/devtools'
+import { devtoolsExchange } from '@urql/devtools'
 import { isDev, apiBaseUrl } from '../utils/config'
 // import { cache } from './cache'
 
 const TOKEN_LOCAL_STORAGE_KEY = 'token'
 
 const exchanges: Exchange[] = [dedupExchange, fetchExchange]
-/*
+
- if (isDev) {
+if (isDev) {
   exchanges.unshift(devtoolsExchange)
 }
-*/
+
 export const getToken = (): string => {
   return localStorage.getItem(TOKEN_LOCAL_STORAGE_KEY)
 }

src/graphql/types.gen.ts

@@ -22,6 +22,7 @@ export type AuthResult = {
 }
 
 export type Author = {
+  about?: Maybe<Scalars['String']>
   bio?: Maybe<Scalars['String']>
   caption?: Maybe<Scalars['String']>
   id: Scalars['Int']
@@ -54,9 +55,9 @@ export type AuthorsBy = {
 }
 
 export type Chat = {
-  admins?: Maybe<Array<Maybe<Scalars['Int']>>>
+  admins?: Maybe<Array<Maybe<Scalars['String']>>>
   createdAt: Scalars['Int']
-  createdBy: Scalars['Int']
+  createdBy: Scalars['String']
   description?: Maybe<Scalars['String']>
   id: Scalars['String']
   members?: Maybe<Array<Maybe<ChatMember>>>
@@ -65,7 +66,7 @@ export type Chat = {
   title?: Maybe<Scalars['String']>
   unread?: Maybe<Scalars['Int']>
   updatedAt: Scalars['Int']
-  users?: Maybe<Array<Maybe<Scalars['Int']>>>
+  users?: Maybe<Array<Maybe<Scalars['String']>>>
 }
 
 export type ChatInput = {
@@ -78,7 +79,6 @@ export type ChatMember = {
   id: Scalars['Int']
   lastSeen?: Maybe<Scalars['DateTime']>
   name: Scalars['String']
-  online?: Maybe<Scalars['Boolean']>
   slug: Scalars['String']
   userpic?: Maybe<Scalars['String']>
 }
@@ -140,13 +140,12 @@ export type LoadShoutsOptions = {
 }
 
 export type Message = {
-  author: Scalars['Int']
+  author: Scalars['String']
   body: Scalars['String']
   chatId: Scalars['String']
   createdAt: Scalars['Int']
   id: Scalars['Int']
   replyTo?: Maybe<Scalars['String']>
-  seen?: Maybe<Scalars['Boolean']>
   updatedAt?: Maybe<Scalars['Int']>
 }
 
@@ -355,7 +354,6 @@ export type Query = {
   loadShout?: Maybe<Shout>
   loadShouts: Array<Maybe<Shout>>
   markdownBody: Scalars['String']
-  searchMessages: Result
   searchRecipients: Result
   signIn: AuthResult
   signOut: AuthResult
@@ -420,12 +418,6 @@ export type QueryMarkdownBodyArgs = {
   body: Scalars['String']
 }
 
-export type QuerySearchMessagesArgs = {
-  by: MessagesBy
-  limit?: InputMaybe<Scalars['Int']>
-  offset?: InputMaybe<Scalars['Int']>
-}
-
 export type QuerySearchRecipientsArgs = {
   limit?: InputMaybe<Scalars['Int']>
   offset?: InputMaybe<Scalars['Int']>
@@ -630,7 +622,14 @@ export type Stat = {
 
 export type Subscription = {
   newMessage: Message
-  collabUpdate: Reaction
+  onlineUpdated: Array<User>
+  reactionUpdated: ReactionUpdating
+  shoutUpdated: Shout
+  userUpdated: User
+}
+
+export type SubscriptionNewMessageArgs = {
+  chats?: InputMaybe<Array<Scalars['Int']>>
 }
 
 export type SubscriptionReactionUpdatedArgs = {

src/styles/Article.module.scss

@@ -60,6 +60,7 @@ img {
 
 .shoutMediaBody {
   display: block;
+
   audio {
     display: inline-block;
   }
@@ -258,6 +259,7 @@ img {
 
 .commentsHeader {
   @include font-size(2.4rem);
+
   margin-bottom: 1em;
 }
 
@@ -287,6 +289,7 @@ img {
 
   button {
     @include font-size(1.5rem);
+
     border-radius: 0.8rem;
     margin-right: 1.2rem;
     padding: 1.1rem 1.2rem 0.9rem;

src/styles/Inbox.scss

@@ -111,6 +111,7 @@ main {
     margin-right: 1em;
     color: #696969;
     cursor: pointer;
+
     &.selected {
       span {
         border-bottom: 3px solid;
@@ -134,10 +135,10 @@ main {
 
 .message-form {
   background: #fff;
-  padding: 2px 0 12px 0;
+  padding: 2px 0 12px;
 
   .wrapper {
-    border: 2px solid #cccccc;
+    border: 2px solid #ccc;
     border-radius: 16px;
     padding: 4px;
     display: flex;
@@ -233,9 +234,9 @@ main {
   }
 
   time {
-    background: #fff;
     @include font-size(1.5rem);
 
+    background: #fff;
     color: #9fa1a7;
     padding: 0 0.5em;
   }

src/styles/app.scss

@@ -85,8 +85,8 @@ h2 {
     color: #fff;
     margin-left: -0.15em;
     padding: 0 0.15em;
-    box-decoration-break: clone;
     -webkit-box-decoration-break: clone;
+    box-decoration-break: clone;
 
     &::selection {
       background: #fff;
@@ -804,5 +804,6 @@ details {
 
 .description {
   @include font-size(1.4rem);
+
   color: rgba(0 0 0 / 40%);
 }

src/utils/apiClient.ts

@@ -12,7 +12,6 @@ import type {
   MutationCreateMessageArgs,
   Chat,
   QueryLoadRecipientsArgs,
-  User,
   ProfileInput
 } from '../graphql/types.gen'
 import { publicGraphQLClient } from '../graphql/publicGraphQLClient'

src/utils/groupby.ts

@@ -4,7 +4,7 @@ export const groupByName = (arr: Author[]) => {
   return arr.reduce(
     (acc, tt) => {
       let c = (tt.name || '')
-        .replace(/[^\d A-Za-zА-я]/g, '')
+        .replaceAll(/[^\d A-Za-zА-я]/g, '')
         .split(' ')
         .pop()
         .slice(0, 1)
@@ -24,7 +24,7 @@ export const groupByTitle = (arr: (Shout | Topic)[]) => {
   return arr.reduce(
     (acc, tt) => {
       let c = (tt.title || '')
-        .replace(/[^\d A-Za-zА-я]/g, '')
+        .replaceAll(/[^\d A-Za-zА-я]/g, '')
         .slice(0, 1)
         .toUpperCase()
       if (/[^А-я]/.test(c)) c = 'A-Z'