@hhgtech/hhg-components 1.19.0-beta-5 → 1.19.0-beta-7

package/src/together/togetherComponentGlobalContext.tsx

@@ -0,0 +1,150 @@
+import React, { createContext, ReactNode, useEffect, useState } from 'react'
+
+import { LocaleType } from 'interfaces/types'
+
+import { PATHS } from './api/paths'
+import { callApiWithAuth, getApiPath } from './api/utils'
+
+export type Role = 'user' | 'admin'
+
+export type UserInfo = {
+  name?: string
+  url?: string
+  phone?: string
+  username?: string
+  avatar?: string
+  email?: string
+  phone_verified?: boolean
+  birthday?: string
+  gender?: number
+  id?: number
+  total_bookmark?: number
+  bookmarks?: Array<string | number>
+  postCount?: number
+  role?: Role
+  commentCount?: number
+  communities_interacted?: number
+  partnerId?: string
+  first_time_bookmark?: boolean
+  provider?: string
+}
+
+export type PushNotificationPayloadType = {
+  message: string
+  type: 'success' | 'danger' | 'info' | 'warning'
+  title?: string
+  displayIcon?: string
+}
+export type TogetherComponentGlobalContextType = {
+  data: {
+    locale?: LocaleType
+    userInfo?: UserInfo
+    togetherUserId?: number
+    env?: {
+      isMarryBaby?: boolean
+      togetherBasePath?: string
+      publicSSO?: string
+      togetherBaseApiUrl?: string
+      subotApiUrl?: string
+      discoverBaseApiUrl?: string
+      careBaseApiUrl?: string
+    }
+    router?: {
+      asPath?: string
+      basePath?: string
+      query?: NodeJS.Dict<string | string[]>
+    }
+  }
+  action: {
+    pushNotifications?: (payload: PushNotificationPayloadType) => void
+    sanitizeFunction?: (h: string) => string
+  }
+}
+export const DefaultComponentGlobalContextData: TogetherComponentGlobalContextType['data'] =
+  {
+    locale: 'vi-VN' as LocaleType,
+    env: {
+      isMarryBaby: false,
+      togetherBasePath: '/community',
+    },
+    router: {
+      basePath: '',
+      asPath: '/',
+    },
+  }
+
+export const TogetherComponentGlobalContext =
+  createContext<TogetherComponentGlobalContextType>({
+    data: DefaultComponentGlobalContextData,
+    action: {
+      pushNotifications: (s) => s,
+      sanitizeFunction: (s) => s,
+    },
+  })
+
+export let GlobalData: TogetherComponentGlobalContextType['data'] =
+  DefaultComponentGlobalContextData
+
+export type Props = {
+  userInfo?: UserInfo
+  locale?: LocaleType
+  children?: ReactNode
+  translation?: { [key: string]: string }
+  router?: any
+  pushNotifications?: (payload: PushNotificationPayloadType) => void
+  sanitizeFunction?: (h: string) => string
+  env?: TogetherComponentGlobalContextType['data']['env']
+}
+export const TogetherComponentGlobalContextProvider = ({
+  locale = 'vi-VN',
+  children,
+  userInfo,
+  router,
+  env = {
+    isMarryBaby: false,
+    togetherBasePath: '/community',
+  },
+  sanitizeFunction = (s) => s,
+  pushNotifications = () => false,
+}: Props) => {
+  const [togetherUserId, setTogetherUserId] = useState()
+
+  GlobalData = {
+    userInfo,
+    locale,
+    togetherUserId,
+    router,
+    env,
+  }
+  useEffect(() => {
+    if (userInfo?.id) {
+      callApiWithAuth(
+        getApiPath(PATHS.PROFILE, {
+          _locale: locale,
+        }),
+        'GET',
+      ).then((res) => {
+        setTogetherUserId(res?.data?.id)
+      })
+    }
+  }, [userInfo?.id])
+  return (
+    <TogetherComponentGlobalContext.Provider
+      value={{
+        data: {
+          userInfo,
+          locale,
+          togetherUserId,
+          router,
+          env,
+        },
+        action: {
+          pushNotifications,
+          sanitizeFunction,
+        },
+      }}
+    >
+      {children}
+    </TogetherComponentGlobalContext.Provider>
+  )
+}

package/src/together/utils/apiActions/comment.tsx

@@ -0,0 +1,168 @@
+import { MAX_IMAGE_UPLOADS } from 'together/interfaces/constants'
+
+import { PATHS } from '../../api/paths'
+import { callApiWithAuth, getApiPath } from '../../api/utils'
+import {
+  encodePostContent,
+  getMentionIdsFromString,
+  uploadAndGetSrc,
+} from '../post'
+
+export const BANNED_STATUS = ['SYSTEM_WITHHELD', 'PREMOD', 'REJECTED']
+export const BANNED_MESSAGE_INTL_ID: { [key: string]: string } = {
+  SYSTEM_WITHHELD: 'notification.comment.systemWithheld',
+  PREMOD: 'notification.comment.premod',
+  REJECTED: 'notification.comment.rejected',
+}
+
+export const getCommentFormBody = async ({
+  postId,
+  message,
+  photos,
+  link,
+  locale,
+  sanitizeFunction,
+
+  replyingUserId,
+  replyingUserName,
+  replyingId,
+}: {
+  locale: string
+  postId: string
+  message: string
+  photos?: File[]
+  link?: string
+  sanitizeFunction?: (text: string) => string
+
+  replyingId?: string
+  replyingUserId?: string
+  replyingUserName?: string
+}) => {
+  const formData = new FormData()
+  let submitText = encodePostContent(
+    message.replace(/(\ )+/g, ' '),
+    sanitizeFunction,
+  )
+  const mentionIds = getMentionIdsFromString(submitText)
+  if (photos && photos.length > 0) {
+    const imageSrcs = await Promise.all(
+      photos?.map((file) => uploadAndGetSrc(file, locale)),
+    )
+    imageSrcs
+      .filter(Boolean)
+      .slice(0, MAX_IMAGE_UPLOADS)
+      .forEach((photo) => {
+        formData.append('images[]', photo)
+      })
+  }
+  if (link) formData.append('link', link)
+  mentionIds?.forEach((mentionId) => {
+    formData.append(`mention_ids[]`, mentionId)
+  })
+  formData.append('post_id', postId)
+
+  replyingId && formData.append('parent_id', replyingId)
+  if (replyingUserId) {
+    mentionIds.unshift(replyingUserId)
+    submitText = `[mention+id="${replyingUserId}"+name="${(
+      replyingUserName || ''
+    ).replace('"', "'")}"]${submitText}`
+    formData.append('parent_user_id', String(replyingUserId))
+  }
+  formData.append('content', submitText)
+  formData.append('content', submitText)
+
+  return formData
+}
+
+export const submitComment = async (
+  formData: FormData,
+  locale: string,
+): Promise<any | null> => {
+  return callApiWithAuth(
+    getApiPath(PATHS.COMMENT.CREATE, {
+      _locale: locale,
+    }),
+    'POST',
+    {
+      data: formData,
+      headers: {
+        'Content-Type': 'multipart/form-data',
+      },
+    },
+  )
+}
+
+export type CommentBodyData = {
+  text: string
+  replyingTo?: string
+}
+
+export const decodeCommentBody = (s: string): CommentBodyData => {
+  try {
+    const authorRegex = s.match(/\[@([^\]]+)\]/)
+    const replyingTo = authorRegex
+      ? authorRegex[0].replace('[@', '').replace(']', '')
+      : ''
+    const text = s.replace(/\[@([^\]]+)\]/, '')
+    return {
+      text: text.trim(),
+      replyingTo,
+    }
+  } catch (e) {}
+  return {
+    text: '',
+  }
+}
+
+export const submitReply = async (
+  formData: FormData,
+  locale: string,
+): Promise<any | null> => {
+  return callApiWithAuth(
+    getApiPath(PATHS.COMMENT.REPLY, {
+      _locale: locale,
+    }),
+    'POST',
+    {
+      data: formData,
+      headers: {
+        'Content-Type': 'multipart/form-data',
+      },
+    },
+  )
+}
+
+export const likeUnlikeComment = async ({
+  commentId,
+  setLike = false,
+  locale,
+}: {
+  commentId: string
+  setLike?: boolean
+  locale: string
+}) => {
+  return callApiWithAuth(
+    getApiPath(setLike ? PATHS.COMMENT.LIKE : PATHS.COMMENT.UNLIKE, {
+      _locale: locale,
+      id: commentId,
+    }),
+    'GET',
+  )
+}
+
+export const deleteComment = ({
+  id,
+  locale,
+}: {
+  id: string
+  locale: string
+}) => {
+  return callApiWithAuth(
+    getApiPath(PATHS.COMMENT.DELETE, {
+      _locale: locale,
+      id: id,
+    }),
+    'DELETE',
+  )
+}

package/src/together/utils/apiActions/community.ts

@@ -0,0 +1,59 @@
+import { formatTopic } from '../../api/dataTransform'
+import { PATHS } from '../../api/paths'
+import { callApiWithAuth, getApiPath } from '../../api/utils'
+import { TopicApi } from '../../interfaces/types'
+import { joinLeaveTopic } from './topic'
+
+export const joinLeaveCommunity = async ({
+  ids,
+  isJoin,
+  locale,
+  cookie,
+}: {
+  ids: string[]
+  isJoin?: boolean
+  locale: string
+  cookie?: string
+}) => {
+  if (!ids || ids.length === 0) return
+  const res = await callApiWithAuth(
+    getApiPath(isJoin ? PATHS.COMMUNITY.JOIN : PATHS.COMMUNITY.LEAVE, {
+      _locale: locale,
+    }),
+    'POST',
+    {
+      data: {
+        ids,
+      },
+    },
+    cookie,
+  )
+  if (res?.status === 1) {
+    if (!isJoin) {
+      ids.forEach(async (id) => {
+        // if left then remove from all topic as well
+        const topicsRes = await callApiWithAuth(
+          getApiPath(PATHS.TOPIC.LIST, {
+            communityId: id,
+            _locale: locale,
+          }),
+          'GET',
+          {},
+          cookie,
+        )
+        if (topicsRes?.data?.topics?.length) {
+          const topics = (topicsRes.data.topics as TopicApi[]).map(formatTopic)
+          await joinLeaveTopic({
+            ids: topics
+              .filter((t) => t.joined && t.id)
+              .map((t) => String(t.id)),
+            isJoin: false,
+            locale,
+            cookie,
+          })
+        }
+      })
+    }
+  }
+  return res
+}

package/src/together/utils/apiActions/post.ts

@@ -0,0 +1,234 @@
+import { MAX_IMAGE_UPLOADS } from 'together/interfaces/constants'
+
+import { PATHS } from '../../api/paths'
+import { callApiWithAuth, getApiPath } from '../../api/utils'
+import {
+  encodePostContent,
+  getMentionIdsFromString,
+  removeBannedWordWrapper,
+  uploadAndGetSrc,
+} from '../post'
+
+export const likeUnlikePost = async ({
+  id,
+  locale,
+}: {
+  id: number | string
+  locale: string
+}) => {
+  if (!id) return
+  const res = await callApiWithAuth(
+    getApiPath(PATHS.POST.LIKE, {
+      id,
+      _locale: locale,
+    }),
+    'GET',
+  )
+  return res
+}
+
+export const deletePost = async ({
+  id,
+  locale,
+}: {
+  id: number | string
+  locale: string
+}) => {
+  if (!id) return
+  const res = await callApiWithAuth(
+    getApiPath(PATHS.POST.DELETE, {
+      id,
+      _locale: locale,
+    }),
+    'DELETE',
+  )
+  return res
+}
+
+export const getPostFormData = async ({
+  title,
+  description,
+  communityId,
+  imageFiles,
+  previewUrl,
+  topicIds,
+  locale,
+  sanitizeFunction,
+  categoryCommunityId,
+  categoryTopicIds,
+
+  // admin only
+  introUrl,
+  bannerUrl,
+  scheduleTime,
+}: {
+  title: string
+  description: string
+  communityId?: string
+  categoryCommunityId?: string
+  imageFiles?: (string | File)[]
+  previewUrl?: {
+    title?: string
+    description?: string
+    url?: string
+    image?: string
+  }
+  topicIds?: string[]
+  categoryTopicIds?: string[]
+  locale: string
+  sanitizeFunction?: (h: string) => string
+  // admin only
+  introUrl?: string
+  bannerUrl?: string | File
+  scheduleTime?: string
+}) => {
+  const bodyFormData = new FormData()
+  const submitDescription = removeBannedWordWrapper(description)
+  const submitTitle = removeBannedWordWrapper(title)
+  const mentionIds = getMentionIdsFromString(submitDescription)
+
+  bodyFormData.append('title', submitTitle)
+  bodyFormData.append(
+    'description',
+    encodePostContent(submitDescription, sanitizeFunction),
+  )
+  if (categoryCommunityId) {
+    bodyFormData.append('category_community', String(categoryCommunityId))
+  } else if (communityId) {
+    bodyFormData.append('community_id', String(communityId))
+  }
+
+  previewUrl?.title && bodyFormData.append('preview_title', previewUrl.title)
+  previewUrl?.description &&
+    bodyFormData.append('preview_description', previewUrl.description)
+  previewUrl?.url && bodyFormData.append('preview_link', previewUrl.url)
+  previewUrl?.image && bodyFormData.append('preview_image', previewUrl.image)
+
+  topicIds?.forEach((topicId) => {
+    bodyFormData.append('topics[]', String(topicId || ''))
+  })
+  categoryTopicIds?.forEach((topicId) => {
+    bodyFormData.append('category_topics[]', String(topicId || ''))
+  })
+  if (!!imageFiles?.length) {
+    const imageSrcs = await Promise.all(
+      imageFiles.map(
+        (file, index) =>
+          new Promise<string>((resolve) => {
+            setTimeout(() => {
+              resolve(uploadAndGetSrc(file, locale))
+            }, index * 2000)
+          }),
+      ),
+    )
+    imageSrcs
+      ?.filter(Boolean)
+      .slice(0, MAX_IMAGE_UPLOADS)
+      .forEach((imageFile, index) => {
+        bodyFormData.append(`images[${index}]`, imageFile)
+      })
+  } else {
+    bodyFormData.append(`images`, '')
+  }
+  mentionIds?.forEach((mentionId) => {
+    bodyFormData.append(`mention_ids[]`, mentionId)
+  })
+
+  // Admin only
+  bodyFormData.append('intro_url', introUrl || '')
+  bodyFormData.append('banner', bannerUrl || '')
+  if (scheduleTime) {
+    bodyFormData.append('post_type', 'scheduled')
+    bodyFormData.append('schedule_datetime', scheduleTime)
+  }
+  return bodyFormData
+}
+
+export const createPost = async ({
+  locale,
+  formData,
+  isArticleComment,
+}: {
+  locale: string
+  formData: FormData
+  isArticleComment?: boolean
+}) => {
+  const res = await callApiWithAuth(
+    getApiPath(
+      isArticleComment ? PATHS.POST.CREATE_ARTICLE_COMMENT : PATHS.POST.CREATE,
+      {
+        _locale: locale,
+      },
+    ),
+    'POST',
+    {
+      data: formData,
+      headers: {
+        'Content-Type': 'multipart/form-data',
+      },
+    },
+  )
+  return res
+}
+
+export const editPost = async ({
+  id,
+  locale,
+  formData,
+}: {
+  id: number | string
+  locale: string
+  formData: FormData
+}) => {
+  const res = await callApiWithAuth(
+    getApiPath(PATHS.POST.UPDATE, {
+      id,
+      _locale: locale,
+    }),
+    'POST',
+    {
+      data: formData,
+    },
+  )
+  return res
+}
+
+export const followUnfollowPost = ({
+  id,
+  locale,
+}: {
+  id: number | string
+  locale: string
+  followValue?: boolean
+}) => {
+  return callApiWithAuth(
+    getApiPath(PATHS.POST.FOLLOW, {
+      id,
+      _locale: locale,
+    }),
+    'GET',
+  )
+}
+
+export const reportPost = ({
+  id,
+  reason,
+  locale,
+}: {
+  id: number | string
+  reason: string
+  locale: string
+}) => {
+  const formData = new FormData()
+  formData.append('reason', reason)
+  return callApiWithAuth(
+    getApiPath(PATHS.POST.REPORT, {
+      _locale: locale,
+      id,
+    }),
+    'POST',
+    {
+      data: formData,
+    },
+  )
+}

package/src/together/utils/apiActions/topic.ts

@@ -0,0 +1,40 @@
+import { PATHS } from '../../api/paths'
+import { callApiWithAuth, getApiPath } from '../../api/utils'
+import { joinLeaveCommunity } from './community'
+
+export const joinLeaveTopic = async ({
+  ids,
+  communityIds,
+  isJoin,
+  locale,
+  cookie,
+}: {
+  ids: string[]
+  communityIds?: string[]
+  isJoin?: boolean
+  locale: string
+  cookie?: string
+}): Promise<any> => {
+  if (!ids || ids.length === 0) return
+  if (isJoin && communityIds?.length) {
+    const communityJoinRes = await joinLeaveCommunity({
+      ids: communityIds,
+      isJoin: true,
+      locale,
+      cookie,
+    })
+  }
+  const res = await callApiWithAuth(
+    getApiPath(isJoin ? PATHS.TOPIC.JOIN : PATHS.TOPIC.LEAVE, {
+      _locale: locale,
+    }),
+    'POST',
+    {
+      data: {
+        ids,
+      },
+    },
+    cookie,
+  )
+  return res
+}

package/src/together/utils/notification.ts

@@ -0,0 +1,20 @@
+import { PushNotificationPayloadType } from 'together/togetherComponentGlobalContext'
+
+type TranslateFunction = (
+  k: string,
+  option?: {
+    [key: string]: any
+  },
+) => any
+
+export const getDefaultSuccessNoti = (t: TranslateFunction) =>
+  ({
+    message: t('notification.success'),
+    type: 'success',
+  } as PushNotificationPayloadType)
+
+export const getDefaultFailNoti = (t: TranslateFunction) =>
+  ({
+    message: t('notification.failure'),
+    type: 'danger',
+  } as PushNotificationPayloadType)