merge-wip-prepare-inbox

src/components/Inbox/DialogAvatar.tsx

@@ -18,10 +18,10 @@ const colors = [
   '#ca6702',
   '#ae2012',
   '#9b2226',
-  '#668CFF',
+  '#668cff',
-  '#C34CFE',
+  '#c34cfe',
-  '#E699FF',
+  '#e699ff',
-  '#6633FF'
+  '#6633ff'
 ]
 
 const getById = (letter: string) =>

src/components/Inbox/DialogCard.tsx

@@ -2,17 +2,43 @@ import './DialogCard.module.scss'
 import styles from './DialogCard.module.scss'
 import DialogAvatar from './DialogAvatar'
 import type { Author } from '../../graphql/types.gen'
+// import { useAuthStore } from '../../stores/auth'
+import { createEffect, createSignal } from 'solid-js'
+import { apiClient } from '../../utils/apiClient'
 
-type Props = {
+const { session } = useAuthStore()
+
+type DialogProps = {
   online?: boolean
   message?: string
   counter?: number
   author?: Author
 }
 
-const DialogCard = (props: Props) => {
+const createChat = async ({ title, members }: { title?: string; members?: string[] }): Promise<void> => {
+  await apiClient.createChat({ title, members })
+}
+
+const DialogCard = (props: DialogProps) => {
+  const [currentUser, setCurrentUser] = createSignal(undefined)
+  createEffect(() => {
+    setCurrentUser(session()?.user?.slug)
+  })
+
+  const handleOpenChat = async () => {
+    try {
+      const test = await apiClient.createChat({
+        title: 'test chat',
+        members: [props.author.slug, currentUser()]
+      })
+      console.log('!!! test:', test)
+    } catch (err) {
+      console.log('!!! errr:', err)
+    }
+  }
+
   return (
-    <div class={styles.DialogCard}>
+    <div class={styles.DialogCard} onClick={handleOpenChat}>
       <div class={styles.avatar}>
         <DialogAvatar name={props.author.name} url={props.author.userpic} online={props.online} />
       </div>

src/components/Views/Inbox.tsx

@@ -6,17 +6,20 @@ import { Loading } from '../Loading'
 import DialogCard from '../Inbox/DialogCard'
 import Search from '../Inbox/Search'
 import { useAuthorsStore } from '../../stores/zine/authors'
+// const { session } = useAuthStore()
 
 import '../../styles/Inbox.scss'
 // Для моков
 import { createClient } from '@urql/core'
 import { findAndLoadGraphQLConfig } from '@graphql-codegen/cli'
+// import { useAuthStore } from '../../stores/auth'
 
 const OWNER_ID = '501'
 const client = createClient({
   url: 'https://graphqlzero.almansi.me/api'
 })
 
+// console.log('!!! session:', session)
 // interface InboxProps {
 //   chats?: Chat[]
 //   messages?: Message[]
@@ -63,6 +66,7 @@ export const InboxView = () => {
   const [authors, setAuthors] = createSignal<Author[]>([])
   const [postMessageText, setPostMessageText] = createSignal('')
   const [loading, setLoading] = createSignal<boolean>(false)
+
   const { sortedAuthors } = useAuthorsStore()
 
   createEffect(() => {
@@ -133,7 +137,7 @@ export const InboxView = () => {
           </div>
           <div class="holder">
             <div class="dialogs">
-              <For each={authors()}>{(author: Author) => <DialogCard author={author} online={true} />}</For>
+              <For each={authors()}>{(author) => <DialogCard author={author} online={true} />}</For>
             </div>
           </div>
         </div>

src/graphql/mutation/create-chat.ts

@@ -0,0 +1,12 @@
+import { gql } from '@urql/core'
+
+export default gql`
+  mutation CreateChat($title: String, $members: [String]!) {
+    createChat(title: $title, members: $members) {
+      error
+      chat {
+        id
+      }
+    }
+  }
+`

src/graphql/types.gen.ts

@@ -24,42 +24,18 @@ export type AuthResult = {
 export type Author = {
   bio?: Maybe<Scalars['String']>
   caption?: Maybe<Scalars['String']>
-  id: Scalars['Int']
-  lastSeen?: Maybe<Scalars['DateTime']>
   links?: Maybe<Array<Maybe<Scalars['String']>>>
   name: Scalars['String']
-  roles?: Maybe<Array<Maybe<Role>>>
   slug: Scalars['String']
-  stat?: Maybe<AuthorStat>
   userpic?: Maybe<Scalars['String']>
 }
 
-export type AuthorStat = {
-  commented?: Maybe<Scalars['Int']>
-  followers?: Maybe<Scalars['Int']>
-  followings?: Maybe<Scalars['Int']>
-  rating?: Maybe<Scalars['Int']>
-}
-
-export type AuthorsBy = {
-  createdAt?: InputMaybe<Scalars['DateTime']>
-  days?: InputMaybe<Scalars['Int']>
-  lastSeen?: InputMaybe<Scalars['DateTime']>
-  name?: InputMaybe<Scalars['String']>
-  order?: InputMaybe<Scalars['String']>
-  slug?: InputMaybe<Scalars['String']>
-  stat?: InputMaybe<Scalars['String']>
-  topic?: InputMaybe<Scalars['String']>
-}
-
 export type Chat = {
-  admins?: Maybe<Array<Maybe<User>>>
   createdAt: Scalars['Int']
   createdBy: User
   description?: Maybe<Scalars['String']>
-  id: Scalars['String']
+  id: Scalars['Int']
   messages: Array<Maybe<Message>>
-  private?: Maybe<Scalars['Boolean']>
   title?: Maybe<Scalars['String']>
   unread?: Maybe<Scalars['Int']>
   updatedAt: Scalars['Int']
@@ -76,8 +52,8 @@ export type ChatMember = {
   invitedAt?: Maybe<Scalars['DateTime']>
   invitedBy?: Maybe<Scalars['String']>
   name: Scalars['String']
+  pic?: Maybe<Scalars['String']>
   slug: Scalars['String']
-  userpic?: Maybe<Scalars['String']>
 }
 
 export type Collab = {
@@ -93,7 +69,6 @@ export type Collection = {
   createdAt: Scalars['DateTime']
   createdBy: User
   desc?: Maybe<Scalars['String']>
-  id: Scalars['Int']
   publishedAt?: Maybe<Scalars['DateTime']>
   slug: Scalars['String']
   title: Scalars['String']
@@ -103,7 +78,6 @@ export type Community = {
   createdAt: Scalars['DateTime']
   createdBy: User
   desc?: Maybe<Scalars['String']>
-  id: Scalars['Int']
   name: Scalars['String']
   pic: Scalars['String']
   slug: Scalars['String']
@@ -122,7 +96,7 @@ export type Message = {
   chatId: Scalars['String']
   createdAt: Scalars['Int']
   id: Scalars['Int']
-  replyTo?: Maybe<Scalars['String']>
+  replyTo?: Maybe<Scalars['Int']>
   updatedAt?: Maybe<Scalars['Int']>
 }
 
@@ -148,7 +122,8 @@ export type Mutation = {
   createReaction: Result
   createShout: Result
   createTopic: Result
-  deleteChat: Result
+  deleteCollection: Result
+  deleteCommunity: Result
   deleteMessage: Result
   deleteReaction: Result
   deleteShout: Result
@@ -184,7 +159,7 @@ export type MutationCreateChatArgs = {
 export type MutationCreateMessageArgs = {
   body: Scalars['String']
   chatId: Scalars['String']
-  replyTo?: InputMaybe<Scalars['String']>
+  replyTo?: InputMaybe<Scalars['Int']>
 }
 
 export type MutationCreateReactionArgs = {
@@ -199,8 +174,12 @@ export type MutationCreateTopicArgs = {
   input: TopicInput
 }
 
-export type MutationDeleteChatArgs = {
+export type MutationDeleteCollectionArgs = {
-  chatId: Scalars['String']
+  slug: Scalars['String']
+}
+
+export type MutationDeleteCommunityArgs = {
+  slug: Scalars['String']
 }
 
 export type MutationDeleteMessageArgs = {
@@ -316,34 +295,58 @@ export type ProfileInput = {
 }
 
 export type Query = {
-  authorsAll: Array<Maybe<Author>>
+  authorsAll: Array<Maybe<User>>
-  getAuthor: User
+  collectionsAll: Array<Maybe<Collection>>
   getCollabs: Array<Maybe<Collab>>
-  getTopic: Topic
+  getCommunities: Array<Maybe<Community>>
+  getCommunity: Community
+  getShoutBySlug: Shout
+  getUserCollections: Array<Maybe<Collection>>
+  getUserRoles: Array<Maybe<Role>>
+  getUsersBySlugs: Array<Maybe<User>>
   isEmailUsed: Scalars['Boolean']
-  loadAuthorsBy: Array<Maybe<Author>>
+  loadChat: Array<Maybe<Message>>
-  loadChats: Result
-  loadMessagesBy: Result
-  loadReactionsBy: Array<Maybe<Reaction>>
-  loadShoutsBy: Array<Maybe<Shout>>
   markdownBody: Scalars['String']
-  searchUsers: Result
+  myChats: Array<Maybe<Chat>>
+  reactionsByAuthor: Array<Maybe<Reaction>>
+  reactionsForShouts: Array<Maybe<Reaction>>
+  recentAll: Array<Maybe<Shout>>
+  recentCandidates: Array<Maybe<Shout>>
+  recentCommented: Array<Maybe<Shout>>
+  recentPublished: Array<Maybe<Shout>>
+  recentReacted: Array<Maybe<Shout>>
+  searchQuery?: Maybe<Array<Maybe<Shout>>>
+  shoutsByAuthors: Array<Maybe<Shout>>
+  shoutsByCollection: Array<Maybe<Shout>>
+  shoutsByCommunities: Array<Maybe<Shout>>
+  shoutsByTopics: Array<Maybe<Shout>>
+  shoutsForFeed: Array<Maybe<Shout>>
   signIn: AuthResult
   signOut: AuthResult
   topicsAll: Array<Maybe<Topic>>
   topicsByAuthor: Array<Maybe<Topic>>
   topicsByCommunity: Array<Maybe<Topic>>
   topicsRandom: Array<Maybe<Topic>>
-  userFollowedAuthors: Array<Maybe<Author>>
+  userFollowedAuthors: Array<Maybe<User>>
+  userFollowedCommunities: Array<Maybe<Community>>
   userFollowedTopics: Array<Maybe<Topic>>
-  userFollowers: Array<Maybe<Author>>
+  userFollowers: Array<Maybe<User>>
+  userReactedShouts: Array<Maybe<Shout>>
 }
 
-export type QueryGetAuthorArgs = {
+export type QueryGetCommunityArgs = {
+  slug?: InputMaybe<Scalars['String']>
+}
+
+export type QueryGetShoutBySlugArgs = {
   slug: Scalars['String']
 }
 
-export type QueryGetTopicArgs = {
+export type QueryGetUserCollectionsArgs = {
+  author: Scalars['String']
+}
+
+export type QueryGetUserRolesArgs = {
   slug: Scalars['String']
 }
 
@@ -351,30 +354,7 @@ export type QueryIsEmailUsedArgs = {
   email: Scalars['String']
 }
 
-export type QueryLoadAuthorsByArgs = {
+export type QueryLoadChatArgs = {
-  amount?: InputMaybe<Scalars['Int']>
-  by?: InputMaybe<AuthorsBy>
-  offset?: InputMaybe<Scalars['Int']>
-}
-
-export type QueryLoadChatsArgs = {
-  amount?: InputMaybe<Scalars['Int']>
-  offset?: InputMaybe<Scalars['Int']>
-}
-
-export type QueryLoadMessagesByArgs = {
-  amount?: InputMaybe<Scalars['Int']>
-  by: MessagesBy
-  offset?: InputMaybe<Scalars['Int']>
-}
-
-export type QueryLoadReactionsByArgs = {
-  amount?: InputMaybe<Scalars['Int']>
-  by: ReactionBy
-  limit?: InputMaybe<Scalars['Int']>
-}
-
-export type QueryLoadShoutsByArgs = {
   amount?: InputMaybe<Scalars['Int']>
   by?: InputMaybe<ShoutsBy>
   offset?: InputMaybe<Scalars['Int']>
@@ -384,10 +364,76 @@ export type QueryMarkdownBodyArgs = {
   body: Scalars['String']
 }
 
-export type QuerySearchUsersArgs = {
+export type QueryReactionsByAuthorArgs = {
-  amount?: InputMaybe<Scalars['Int']>
+  limit: Scalars['Int']
-  offset?: InputMaybe<Scalars['Int']>
+  offset: Scalars['Int']
-  query: Scalars['String']
+  slug: Scalars['String']
+}
+
+export type QueryReactionsForShoutsArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+  shouts: Array<InputMaybe<Scalars['String']>>
+}
+
+export type QueryRecentAllArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+}
+
+export type QueryRecentCandidatesArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+}
+
+export type QueryRecentCommentedArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+}
+
+export type QueryRecentPublishedArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+}
+
+export type QueryRecentReactedArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+}
+
+export type QuerySearchQueryArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+  q?: InputMaybe<Scalars['String']>
+}
+
+export type QueryShoutsByAuthorsArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+  slugs: Array<InputMaybe<Scalars['String']>>
+}
+
+export type QueryShoutsByCollectionArgs = {
+  collection: Scalars['String']
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+}
+
+export type QueryShoutsByCommunitiesArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+  slugs: Array<InputMaybe<Scalars['String']>>
+}
+
+export type QueryShoutsByTopicsArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
+  slugs: Array<InputMaybe<Scalars['String']>>
+}
+
+export type QueryShoutsForFeedArgs = {
+  limit: Scalars['Int']
+  offset: Scalars['Int']
 }
 
 export type QuerySignInArgs = {
@@ -495,8 +541,8 @@ export type Resource = {
 }
 
 export type Result = {
-  author?: Maybe<Author>
+  author?: Maybe<User>
-  authors?: Maybe<Array<Maybe<Author>>>
+  authors?: Maybe<Array<Maybe<User>>>
   chat?: Maybe<Chat>
   chats?: Maybe<Array<Maybe<Chat>>>
   communities?: Maybe<Array<Maybe<Community>>>
@@ -509,10 +555,8 @@ export type Result = {
   reactions?: Maybe<Array<Maybe<Reaction>>>
   shout?: Maybe<Shout>
   shouts?: Maybe<Array<Maybe<Shout>>>
-  slugs?: Maybe<Array<Maybe<Scalars['String']>>>
   topic?: Maybe<Topic>
   topics?: Maybe<Array<Maybe<Topic>>>
-  uids?: Maybe<Array<Maybe<Scalars['String']>>>
 }
 
 export type Role = {
@@ -531,6 +575,7 @@ export type Shout = {
   createdAt: Scalars['DateTime']
   deletedAt?: Maybe<Scalars['DateTime']>
   deletedBy?: Maybe<User>
+  draft?: Maybe<Scalars['Boolean']>
   id: Scalars['Int']
   lang?: Maybe<Scalars['String']>
   layout?: Maybe<Scalars['String']>
@@ -545,8 +590,8 @@ export type Shout = {
   topics?: Maybe<Array<Maybe<Topic>>>
   updatedAt?: Maybe<Scalars['DateTime']>
   updatedBy?: Maybe<User>
-  versionOf?: Maybe<Scalars['String']>
+  versionOf?: Maybe<Shout>
-  visibility?: Maybe<Scalars['String']>
+  visibleFor?: Maybe<Array<Maybe<User>>>
 }
 
 export type ShoutInput = {

src/styles/Inbox.scss

@@ -4,6 +4,10 @@ main {
   flex-direction: column;
   position: relative;
 }
+// TODO: добавлять когда открыт чат
+body {
+  overflow: hidden;
+}
 
 .messages {
   top: 74px;
@@ -17,7 +21,7 @@ main {
   flex: 1;
   flex-direction: column;
   position: fixed;
-  z-index: 1;
+  z-index: 9;
 
   > .row {
     flex: 1;

src/utils/apiClient.ts

@@ -34,6 +34,7 @@ import authorBySlug from '../graphql/query/author-by-slug'
 import shoutsLoadBy from '../graphql/query/articles-load-by'
 import reactionsLoadBy from '../graphql/query/reactions-load-by'
 import authorsLoadBy from '../graphql/query/authors-load-by'
+import createChatQuery from '../graphql/mutation/create-chat'
 
 const FEED_SIZE = 50
 
@@ -396,6 +397,12 @@ export const apiClient = {
   incrementView: async ({ articleSlug }) => {
     await privateGraphQLClient.mutation(incrementView, { shout: articleSlug })
   },
+  createChat: async ({ title, members }) => {
+    return await privateGraphQLClient
+      .mutation(createChatQuery, { title: title, members: members })
+      .toPromise()
+  },
+
   getChats: async (payload = {}) => {
     const resp = await privateGraphQLClient.query(myChats, payload).toPromise()
     return resp.data.myChats

src/utils/config.ts

@@ -1,6 +1,6 @@
-export const isDev = import.meta.env.VERCEL_ENV !== 'production'
+export const isDev = import.meta.env.MODE === 'development'
-export const apiBaseUrl =
+
-  import.meta.env.PUBLIC_API_URL ||
+export const apiBaseUrl = 'https://testapi.discours.io'
-  import.meta.env.API_URL ||
+// export const apiBaseUrl = 'https://newapi.discours.io'
-  import.meta.env.VITE_API_URL ||
+// testapi.discours.io
-  'http://localhost:8080'
+// export const apiBaseUrl = 'http://localhost:8080'