discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

Merge branch 'hotfix/editor-permission' into feature/rating

Browse Source
This commit is contained in:
Untone 2024-05-02 17:05:46 +03:00
commit a89a9bb1f4
45 changed files with 2422 additions and 1259 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
biome.json
View File

@ -1,8 +1,21 @@
{
"$schema": "https://biomejs.dev/schemas/1.5.3/schema.json",
"files": {
"include": ["*.tsx", "*.ts", "*.js", "*.json"],
"ignore": ["./dist", "./node_modules", ".husky", "docs", "gen", "*.gen.ts", "*.d.ts"]
"include": [
"*.tsx",
"*.ts",
"*.js",
"*.json"
],
"ignore": [
"./dist",
"./node_modules",
".husky",
"docs",
"gen",
"*.gen.ts",
"*.d.ts"
]
},
"vcs": {
"defaultBranch": "dev",
@ -10,13 +23,19 @@
},
"organizeImports": {
"enabled": true,
"ignore": ["./api", "./gen"]
"ignore": [
"./api",
"./gen"
]
},
"formatter": {
"indentStyle": "space",
"indentWidth": 2,
"lineWidth": 108,
"ignore": ["./src/graphql/schema", "./gen"]
"ignore": [
"./src/graphql/schema",
"./gen"
]
},
"javascript": {
"formatter": {
@ -29,14 +48,21 @@
}
},
"linter": {
"ignore": ["*.scss", "*.md", ".DS_Store", "*.svg", "*.d.ts"],
"ignore": [
"*.scss",
"*.md",
".DS_Store",
"*.svg",
"*.d.ts"
],
"enabled": true,
"rules": {
"all": true,
"complexity": {
"noForEach": "off",
"useOptionalChain": "warn",
"useLiteralKeys": "off"
"useLiteralKeys": "off",
"noExcessiveCognitiveComplexity": "off"
},
"correctness": {
"useHookAtTopLevel": "off"
@ -54,15 +80,18 @@
"noSvgWithoutTitle": "off"
},
"nursery": {
"useImportRestrictions": "off",
"useImportType": "off",
"useFilenamingConvention": "off"
"useImportRestrictions": "off"
},
"performance": {
"noBarrelFile": "off"
},
"style": {
"useBlockStatements": "off",
"noImplicitBoolean": "off",
"useNamingConvention": "off",
"noDefaultExport": "off"
"useImportType": "off",
"noDefaultExport": "off",
"useFilenamingConvention": "off"
},
"suspicious": {
"noConsoleLog": "off",
@ -70,4 +99,4 @@
}
}
}
}
}

3230
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

14
package.json
View File

@ -11,12 +11,12 @@
"deploy": "graphql-codegen && npm run typecheck && vite build && vercel",
"dev": "vite",
"e2e": "npx playwright test --project=chromium",
"fix": "npm run check:code:fix && stylelint **/*.{scss,css} --fix",
"fix": "npm run lint:code:fix && stylelint **/*.{scss,css} --fix",
"format": "npx @biomejs/biome format src/. --write",
"hygen": "HYGEN_TMPLS=gen hygen",
"postinstall": "npm run codegen && npx patch-package",
"check:code": "npx @biomejs/biome check src --log-kind=compact --verbose",
"check:code:fix": "npx @biomejs/biome check src --log-kind=compact",
"check:code:fix": "npx @biomejs/biome lint src --log-kind=compact",
"lint": "npm run lint:code && stylelint **/*.{scss,css}",
"lint:code": "npx @biomejs/biome lint src --log-kind=compact --verbose",
"lint:code:fix": "npx @biomejs/biome lint src --apply-unsafe --log-kind=compact --verbose",
@ -35,7 +35,7 @@
"devDependencies": {
"@authorizerdev/authorizer-js": "2.0.0",
"@babel/core": "7.23.3",
"@biomejs/biome": "^1.5.3",
"@biomejs/biome": "^1.7.2",
"@graphql-codegen/cli": "^5.0.0",
"@graphql-codegen/typescript": "^4.0.1",
"@graphql-codegen/typescript-operations": "^4.0.1",
@ -129,8 +129,9 @@
"typograf": "7.3.0",
"uniqolor": "1.1.0",
"vike": "0.4.148",
"vite": "5.1.2",
"vite": "5.2.10",
"vite-plugin-mkcert": "^1.17.3",
"vite-plugin-node-polyfills": "0.21.0",
"vite-plugin-sass-dts": "^1.3.17",
"vite-plugin-solid": "2.10.1",
"y-prosemirror": "1.2.2",
@ -139,5 +140,8 @@
"overrides": {
"y-prosemirror": "1.2.2",
"yjs": "13.6.12"
}
},
"trustedDependencies": [
"@biomejs/biome"
]
}

6
src/components/App.tsx
View File

@ -40,15 +40,11 @@ import { InboxPage } from '../pages/inbox.page'
import { HomePage } from '../pages/index.page'
import { ProfileSecurityPage } from '../pages/profile/profileSecurity.page'
import { ProfileSettingsPage } from '../pages/profile/profileSettings.page'
//TODO: ProfileSubscriptionsPage - garbage code?
import { ProfileSubscriptionsPage } from '../pages/profile/profileSubscriptions.page'
import { SearchPage } from '../pages/search.page'
import { TopicPage } from '../pages/topic.page'
import { ROUTES, useRouter } from '../stores/router'
import { MODALS, hideModal, showModal } from '../stores/ui'
// TODO: lazy load
// const SomePage = lazy(() => import('./Pages/SomePage'))
import { MODALS, showModal } from '../stores/ui'
const pagesMap: Record<keyof typeof ROUTES, Component<PageProps>> = {
author: AuthorPage,

2
src/components/Article/CommentDate/CommentDate.tsx
View File

@ -14,7 +14,7 @@ type Props = {
}
export const CommentDate = (props: Props) => {
const { t, formatDate } = useLocalize()
const { formatDate } = useLocalize()
const formattedDate = (date: number) => {
const formatDateOptions: Intl.DateTimeFormatOptions = props.isShort

9
src/components/Author/AuthorBadge/AuthorBadge.tsx
View File

@ -1,6 +1,6 @@
import { openPage } from '@nanostores/router'
import { clsx } from 'clsx'
import { Match, Show, Switch, createEffect, createMemo, createSignal, on } from 'solid-js'
import { Match, Show, Switch, createEffect, createMemo, createSignal } from 'solid-js'
import { useFollowing } from '../../../context/following'
import { useLocalize } from '../../../context/localize'
@ -36,7 +36,7 @@ export const AuthorBadge = (props: Props) => {
const [isSubscribed, setIsSubscribed] = createSignal<boolean>()
createEffect(() => {
if (!subscriptions || !props.author) return
if (!(subscriptions && props.author)) return
const subscribed = subscriptions.authors?.some((authorEntity) => authorEntity.id === props.author?.id)
setIsSubscribed(subscribed)
})
@ -45,7 +45,7 @@ export const AuthorBadge = (props: Props) => {
setIsMobileView(!mediaMatches.sm)
})
const { setFollowing } = useFollowing()
// const { setFollowing } = useFollowing()
const { changeSearchParams } = useRouter()
const { t, formatDate, lang } = useLocalize()
@ -127,6 +127,9 @@ export const AuthorBadge = (props: Props) => {
<Show when={props.author?.stat.shouts > 0}>
<div>{t('PublicationsWithCount', { count: props.author.stat?.shouts ?? 0 })}</div>
</Show>
<Show when={props.author?.stat.comments > 0}>
<div>{t('CommentsWithCount', { count: props.author.stat?.comments ?? 0 })}</div>
</Show>
<Show when={props.author?.stat.followers > 0}>
<div>{t('FollowersWithCount', { count: props.author.stat?.followers ?? 0 })}</div>
</Show>

2
src/components/Author/AuthorCard/AuthorCard.tsx
View File

@ -43,7 +43,7 @@ export const AuthorCard = (props: Props) => {
})
createEffect(() => {
if (!subscriptions || !props.author) return
if (!(subscriptions && props.author)) return
const subscribed = subscriptions.authors?.some((authorEntity) => authorEntity.id === props.author?.id)
setIsSubscribed(subscribed)
})

4
src/components/AuthorsList/AuthorsList.tsx
View File

@ -1,9 +1,7 @@
import { clsx } from 'clsx'
import { For, Show, createEffect, createSignal, on, onMount } from 'solid-js'
import { useFollowing } from '../../context/following'
import { For, Show, createEffect, createSignal, on } from 'solid-js'
import { useLocalize } from '../../context/localize'
import { apiClient } from '../../graphql/client/core'
import { Author } from '../../graphql/schema/core.gen'
import { setAuthorsByFollowers, setAuthorsByShouts, useAuthorsStore } from '../../stores/zine/authors'
import { AuthorBadge } from '../Author/AuthorBadge'
import { InlineLoader } from '../InlineLoader'

2
src/components/Discours/Hero.tsx
View File

@ -1,7 +1,7 @@
import { useLocalize } from '../../context/localize'
import { useRouter } from '../../stores/router'
import { showModal } from '../../stores/ui'
import { AuthModalSearchParams } from '../Nav/AuthModal/types'
import type { AuthModalSearchParams } from '../Nav/AuthModal/types'
import styles from './Hero.module.scss'

3
src/components/Editor/AudioUploader/AudioUploader.tsx
View File

@ -1,5 +1,3 @@
import { Buffer } from 'buffer'
import { clsx } from 'clsx'
import { Show } from 'solid-js'
@ -9,6 +7,7 @@ import { composeMediaItems } from '../../../utils/composeMediaItems'
import { AudioPlayer } from '../../Article/AudioPlayer'
import { DropArea } from '../../_shared/DropArea'
// import { Buffer } from 'node:buffer'
import styles from './AudioUploader.module.scss'
window.Buffer = Buffer

6
src/components/Editor/Editor.tsx
View File

@ -1,5 +1,3 @@
import type { Doc } from 'yjs/dist/src/utils/Doc'
import { HocuspocusProvider } from '@hocuspocus/provider'
import { isTextSelection } from '@tiptap/core'
import { Bold } from '@tiptap/extension-bold'
@ -30,7 +28,7 @@ import { Underline } from '@tiptap/extension-underline'
import { createEffect, createSignal, onCleanup } from 'solid-js'
import { createTiptapEditor, useEditorHTML } from 'solid-tiptap'
import uniqolor from 'uniqolor'
import * as Y from 'yjs'
import { Doc } from 'yjs'
import { useEditorContext } from '../../context/editor'
import { useLocalize } from '../../context/localize'
@ -85,7 +83,7 @@ export const Editor = (props: Props) => {
const docName = `shout-${props.shoutId}`
if (!yDocs[docName]) {
yDocs[docName] = new Y.Doc()
yDocs[docName] = new Doc()
}
if (!providers[docName]) {

6
src/components/Editor/EditorFloatingMenu/EditorFloatingMenu.tsx
View File

@ -29,8 +29,10 @@ const embedData = (data) => {
const result: { src: string; width?: string; height?: string } = { src: '' }
for (let i = 0; i < attributes.length; i++) {
const attribute = attributes[i]
result[attribute.name] = attribute.value
const attribute = attributes.item(i)
if (attribute) {
result[attribute.name] = attribute.value
}
}
return result

2
src/components/Editor/Panel/Panel.tsx
View File

@ -13,8 +13,6 @@ import { useOutsideClickHandler } from '../../../utils/useOutsideClickHandler'
import { Button } from '../../_shared/Button'
import { DarkModeToggle } from '../../_shared/DarkModeToggle'
import { Icon } from '../../_shared/Icon'
import { useSnackbar } from '../../../context/snackbar'
import styles from './Panel.module.scss'
const typograf = new Typograf({ locale: ['ru', 'en-US'] })

2
src/components/Feed/Beside.tsx
View File

@ -4,8 +4,6 @@ import type { Author, Shout, Topic } from '../../graphql/schema/core.gen'
import { clsx } from 'clsx'
import { For, Show } from 'solid-js'
import { useFollowing } from '../../context/following'
import { useLocalize } from '../../context/localize'
import { AuthorBadge } from '../Author/AuthorBadge'
import { TopicCard } from '../Topic/Card'

3
src/components/InlineLoader/InlineLoader.tsx
View File

@ -1,4 +1,3 @@
import { clsx } from 'clsx'
import { useLocalize } from '../../context/localize'
import { Loading } from '../_shared/Loading'
import styles from './InlineLoader.module.scss'
@ -7,7 +6,7 @@ type Props = {
class?: string
}
export const InlineLoader = (props: Props) => {
export const InlineLoader = (_props: Props) => {
const { t } = useLocalize()
return (
<div class={styles.InlineLoader}>

6
src/components/Nav/AuthModal/LoginForm.tsx
View File

@ -1,7 +1,7 @@
import type { AuthModalSearchParams } from './types'
import { clsx } from 'clsx'
import { JSX, Show, createEffect, createSignal } from 'solid-js'
import { JSX, Show, createSignal } from 'solid-js'
import { useLocalize } from '../../../context/localize'
import { useSession } from '../../../context/session'
@ -31,8 +31,8 @@ export const LoginForm = () => {
const [isSubmitting, setIsSubmitting] = createSignal(false)
const [password, setPassword] = createSignal('')
const [validationErrors, setValidationErrors] = createSignal<ValidationErrors>({})
const [isLinkSent, setIsLinkSent] = createSignal(false)
// FIXME: use signal or remove
const [_isLinkSent, setIsLinkSent] = createSignal(false)
const authFormRef: { current: HTMLFormElement } = { current: null }
const { showSnackbar } = useSnackbar()
const { signIn } = useSession()

17
src/components/Nav/AuthModal/RegisterForm.tsx
View File

@ -32,7 +32,8 @@ export const RegisterForm = () => {
const { changeSearchParams } = useRouter<AuthModalSearchParams>()
const { t } = useLocalize()
const { signUp, isRegistered, resendVerifyEmail } = useSession()
const [submitError, setSubmitError] = createSignal('')
// FIXME: use submit error data or remove signal
const [_submitError, setSubmitError] = createSignal('')
const [fullName, setFullName] = createSignal('')
const [password, setPassword] = createSignal('')
const [isSubmitting, setIsSubmitting] = createSignal(false)
@ -116,7 +117,7 @@ export const RegisterForm = () => {
const handleCheckEmailStatus = (status: EmailStatus | string) => {
switch (status) {
case 'not verified':
case 'not verified': {
setValidationErrors((prev) => ({
...prev,
email: (
@ -129,8 +130,9 @@ export const RegisterForm = () => {
),
}))
break
case 'verified':
setValidationErrors((prev) => ({
}
case 'verified': {
setValidationErrors((_prev) => ({
email: (
<>
{t('This email is registered')}. {t('try')}
@ -142,7 +144,8 @@ export const RegisterForm = () => {
),
}))
break
case 'registered':
}
case 'registered': {
setValidationErrors((prev) => ({
...prev,
email: (
@ -156,9 +159,11 @@ export const RegisterForm = () => {
),
}))
break
default:
}
default: {
console.info('[RegisterForm] email is not registered')
break
}
}
}

3
src/components/Nav/HeaderAuth.tsx
View File

@ -59,7 +59,8 @@ export const HeaderAuth = (props: Props) => {
toggleEditorPanel()
}
const handleSaveButtonClick = () => {
// FIXME: remove the code if not needed here
const _handleSaveButtonClick = () => {
saveShout(form)
}

2
src/components/NotificationsPanel/NotificationView/NotificationGroup.tsx
View File

@ -63,7 +63,7 @@ export const NotificationGroup = (props: NotificationGroupProps) => {
return (
<>
<For each={props.notifications}>
{(n: Group, index) => (
{(n: Group, _index) => (
<>
{t(threadCaption(n.thread), { commentsCount: n.reactions.length })}{' '}
<div

6
src/components/Topic/Card.tsx
View File

@ -42,14 +42,16 @@ export const TopicCard = (props: TopicProps) => {
const { follow, unfollow, subscriptions, subscribeInAction } = useFollowing()
createEffect(() => {
if (!subscriptions || !props.topic) return
if (!(subscriptions && props.topic)) return
const subscribed = subscriptions.topics?.some((topics) => topics.id === props.topic?.id)
setIsSubscribed(subscribed)
})
const handleFollowClick = () => {
requireAuthentication(() => {
follow(FollowingEntity.Topic, props.topic.slug)
isSubscribed()
? unfollow(FollowingEntity.Topic, props.topic.slug)
: follow(FollowingEntity.Topic, props.topic.slug)
}, 'subscribe')
}

4
src/components/Topic/TopicBadge/TopicBadge.tsx
View File

@ -1,5 +1,5 @@
import { clsx } from 'clsx'
import { Show, createEffect, createSignal, on } from 'solid-js'
import { Show, createEffect, createSignal } from 'solid-js'
import { useFollowing } from '../../../context/following'
import { useLocalize } from '../../../context/localize'
@ -26,7 +26,7 @@ export const TopicBadge = (props: Props) => {
const { follow, unfollow, subscriptions, subscribeInAction } = useFollowing()
createEffect(() => {
if (!subscriptions || !props.topic) return
if (!(subscriptions && props.topic)) return
const subscribed = subscriptions.topics?.some((topics) => topics.id === props.topic?.id)
setIsSubscribed(subscribed)
})

6
src/components/Views/AllAuthors/AllAuthors.tsx
View File

@ -2,11 +2,11 @@ import type { Author } from '../../../graphql/schema/core.gen'
import { Meta } from '@solidjs/meta'
import { clsx } from 'clsx'
import { For, Show, createEffect, createMemo, createSignal } from 'solid-js'
import { For, Show, createMemo, createSignal } from 'solid-js'
import { useLocalize } from '../../../context/localize'
import { useRouter } from '../../../stores/router'
import { setAuthorsSort, useAuthorsStore } from '../../../stores/zine/authors'
import { useAuthorsStore } from '../../../stores/zine/authors'
import { getImageUrl } from '../../../utils/getImageUrl'
import { scrollHandler } from '../../../utils/scroll'
import { authorLetterReduce, translateAuthor } from '../../../utils/translate'
@ -33,7 +33,7 @@ export const AllAuthors = (props: Props) => {
const [searchQuery, setSearchQuery] = createSignal('')
const ALPHABET =
lang() === 'ru' ? [...'АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯ@'] : [...'ABCDEFGHIJKLMNOPQRSTUVWXYZ@']
const { searchParams, changeSearchParams } = useRouter<AllAuthorsPageSearchParams>()
const { searchParams } = useRouter<AllAuthorsPageSearchParams>()
const { sortedAuthors } = useAuthorsStore({
authors: props.authors,
sortBy: searchParams().by || 'name',

2
src/components/Views/AllTopics/AllTopics.tsx
View File

@ -3,8 +3,6 @@ import type { Topic } from '../../../graphql/schema/core.gen'
import { Meta } from '@solidjs/meta'
import { clsx } from 'clsx'
import { For, Show, createEffect, createMemo, createSignal } from 'solid-js'
import { useFollowing } from '../../../context/following'
import { useLocalize } from '../../../context/localize'
import { useRouter } from '../../../stores/router'
import { setTopicsSort, useTopicsStore } from '../../../stores/zine/topics'

7
src/components/Views/Author/Author.tsx
View File

@ -11,7 +11,7 @@ import { useSession } from '../../../context/session'
import { apiClient } from '../../../graphql/client/core'
import { router, useRouter } from '../../../stores/router'
import { loadShouts, useArticlesStore } from '../../../stores/zine/articles'
import { loadAuthor, useAuthorsStore } from '../../../stores/zine/authors'
import { loadAuthor } from '../../../stores/zine/authors'
import { getImageUrl } from '../../../utils/getImageUrl'
import { getDescription } from '../../../utils/meta'
import { restoreScrollPosition, saveScrollPosition } from '../../../utils/scroll'
@ -39,10 +39,9 @@ const LOAD_MORE_PAGE_SIZE = 9
export const AuthorView = (props: Props) => {
const { t } = useLocalize()
const { subscriptions, followers: myFollowers, loadSubscriptions } = useFollowing()
const { followers: myFollowers } = useFollowing()
const { session } = useSession()
const { sortedArticles } = useArticlesStore({ shouts: props.shouts })
const { authorEntities } = useAuthorsStore({ authors: [props.author] })
const { page: getPage, searchParams } = useRouter()
const [isLoadMoreButtonVisible, setIsLoadMoreButtonVisible] = createSignal(false)
const [isBioExpanded, setIsBioExpanded] = createSignal(false)
@ -87,7 +86,7 @@ export const AuthorView = (props: Props) => {
setFollowing([...(authors || []), ...(topics || [])])
setFollowers(followersResult || [])
console.info('[components.Author] data loaded')
console.debug('[components.Author] following data loaded', subscriptionsResult)
} catch (error) {
console.error('[components.Author] fetch error', error)
}

50
src/components/Views/DraftsView/DraftsView.tsx
View File

@ -1,6 +1,6 @@
import { openPage } from '@nanostores/router'
import { clsx } from 'clsx'
import { For, Show, createEffect, createSignal } from 'solid-js'
import { For, Show, createEffect, createSignal, on } from 'solid-js'
import { useEditorContext } from '../../../context/editor'
import { useSession } from '../../../context/session'
@ -9,22 +9,24 @@ import { Shout } from '../../../graphql/schema/core.gen'
import { router } from '../../../stores/router'
import { Draft } from '../../Draft'
import { Loading } from '../../_shared/Loading'
import styles from './DraftsView.module.scss'
export const DraftsView = () => {
const { isAuthenticated, isSessionLoaded } = useSession()
const { session } = useSession()
const [drafts, setDrafts] = createSignal<Shout[]>([])
const loadDrafts = async () => {
if (apiClient.private) {
const loadedDrafts = await apiClient.getDrafts()
setDrafts(loadedDrafts.reverse() || [])
}
}
createEffect(() => {
if (isSessionLoaded()) loadDrafts()
})
createEffect(
on(
() => session(),
async (s) => {
if (s) {
const loadedDrafts = await apiClient.getDrafts()
setDrafts(loadedDrafts.reverse() || [])
}
},
),
)
const { publishShoutById, deleteShout } = useEditorContext()
@ -44,22 +46,20 @@ export const DraftsView = () => {
return (
<div class={clsx(styles.DraftsView)}>
<Show when={isSessionLoaded()}>
<Show when={session()?.user?.id} fallback={<Loading />}>
<div class="wide-container">
<div class="row">
<div class="col-md-19 col-lg-18 col-xl-16 offset-md-5">
<Show when={isAuthenticated()} fallback="Давайте авторизуемся">
<For each={drafts()}>
{(draft) => (
<Draft
class={styles.draft}
shout={draft}
onDelete={handleDraftDelete}
onPublish={handleDraftPublish}
/>
)}
</For>
</Show>
<For each={drafts()}>
{(draft) => (
<Draft
class={styles.draft}
shout={draft}
onDelete={handleDraftDelete}
onPublish={handleDraftPublish}
/>
)}
</For>
</div>
</div>
</div>

53
src/components/Views/EditView/EditView.tsx
View File

@ -2,6 +2,7 @@ import { clsx } from 'clsx'
import deepEqual from 'fast-deep-equal'
import { Accessor, Show, createMemo, createSignal, lazy, onCleanup, onMount } from 'solid-js'
import { createStore } from 'solid-js/store'
import { throttle } from 'throttle-debounce'
import { ShoutForm, useEditorContext } from '../../../context/editor'
import { useLocalize } from '../../../context/localize'
@ -41,7 +42,9 @@ export const EMPTY_TOPIC: Topic = {
slug: '',
}
const THROTTLING_INTERVAL = 2000
const AUTO_SAVE_INTERVAL = 5000
const AUTO_SAVE_DELAY = 5000
const handleScrollTopButtonClick = (e) => {
e.preventDefault()
window.scrollTo({
@ -66,8 +69,9 @@ export const EditView = (props: Props) => {
const shoutTopics = props.shout.topics || []
// TODO: проверить сохранение черновика в local storage (не работает)
const draft = getDraftFromLocalStorage(props.shout.id)
const draft = props.shout || getDraftFromLocalStorage(props.shout.id)
if (draft) {
// console.debug('draft: ', draft)
setForm(Object.keys(draft).length !== 0 ? draft : { shoutId: props.shout.id })
} else {
setForm({
@ -180,42 +184,43 @@ export const EditView = (props: Props) => {
let autoSaveTimeOutId: number | string | NodeJS.Timeout
//TODO: add throttle
const autoSaveRecursive = () => {
autoSaveTimeOutId = setTimeout(async () => {
const hasChanges = !deepEqual(form, prevForm)
if (hasChanges) {
setSaving(true)
if (props.shout?.published_at) {
saveDraftToLocalStorage(form)
} else {
await saveDraft(form)
}
setPrevForm(clone(form))
setTimeout(() => {
setSaving(false)
}, 2000)
const autoSave = async () => {
const hasChanges = !deepEqual(form, prevForm)
const hasTopic = Boolean(form.mainTopic)
if (hasChanges && hasTopic) {
setSaving(true)
if (props.shout?.published_at) {
saveDraftToLocalStorage(form)
} else {
await saveDraft(form)
}
setPrevForm(clone(form))
setTimeout(() => {
setSaving(false)
}, AUTO_SAVE_DELAY)
}
}
// Throttle the autoSave function
const throttledAutoSave = throttle(THROTTLING_INTERVAL, autoSave)
const autoSaveRecursive = () => {
autoSaveTimeOutId = setTimeout(() => {
throttledAutoSave()
autoSaveRecursive()
}, AUTO_SAVE_INTERVAL)
}
const stopAutoSave = () => {
clearTimeout(autoSaveTimeOutId)
}
onMount(() => {
autoSaveRecursive()
})
onCleanup(() => {
stopAutoSave()
onCleanup(() => clearTimeout(autoSaveTimeOutId))
})
const showSubtitleInput = () => {
setIsSubtitleVisible(true)
subtitleInput.current.focus()
}
const showLeadInput = () => {
setIsLeadVisible(true)
}

6
src/components/Views/Feed/Feed.tsx
View File

@ -49,7 +49,7 @@ type VisibilityItem = {
}
type FeedSearchParams = {
by: 'publish_date' | 'likes' | 'comments'
by: 'publish_date' | 'likes' | 'last_comment'
period: FeedPeriod
visibility: VisibilityMode
}
@ -258,10 +258,10 @@ export const FeedView = (props: Props) => {
</li>
<li
class={clsx({
'view-switcher__item--selected': searchParams().by === 'comments',
'view-switcher__item--selected': searchParams().by === 'last_comment',
})}
>
<span class="link" onClick={() => changeSearchParams({ by: 'comments' })}>
<span class="link" onClick={() => changeSearchParams({ by: 'last_comment' })}>
{t('Most commented')}
</span>
</li>

7
src/components/Views/Home.tsx
View File

@ -1,8 +1,7 @@
import { getPagePath } from '@nanostores/router'
import { For, Show, batch, createMemo, createSignal, onMount } from 'solid-js'
import { For, Show, createMemo, createSignal, onMount } from 'solid-js'
import { useLocalize } from '../../context/localize'
import { apiClient } from '../../graphql/client/core'
import { Shout, Topic } from '../../graphql/schema/core.gen'
import { router } from '../../stores/router'
import {
@ -52,8 +51,8 @@ export const HomeView = (props: Props) => {
const { topAuthors } = useTopAuthorsStore()
const { t } = useLocalize()
const [randomTopic, setRandomTopic] = createSignal<Topic>(null)
const [randomTopicArticles, setRandomTopicArticles] = createSignal<Shout[]>([])
const [randomTopic, _setRandomTopic] = createSignal<Topic>(null)
const [randomTopicArticles, _setRandomTopicArticles] = createSignal<Shout[]>([])
onMount(async () => {
loadTopArticles()

5
src/components/Views/ProfileSubscriptions/ProfileSubscriptions.tsx
View File

@ -1,10 +1,8 @@
import { clsx } from 'clsx'
import { For, Show, createEffect, createSignal, onMount } from 'solid-js'
import { For, Show, createEffect, createSignal } from 'solid-js'
import { useFollowing } from '../../../context/following'
import { useLocalize } from '../../../context/localize'
import { useSession } from '../../../context/session'
import { apiClient } from '../../../graphql/client/core'
import { Author, Topic } from '../../../graphql/schema/core.gen'
import { SubscriptionFilter } from '../../../pages/types'
import { dummyFilter } from '../../../utils/dummyFilter'
@ -21,7 +19,6 @@ import stylesSettings from '../../../styles/FeedSettings.module.scss'
export const ProfileSubscriptions = () => {
const { t, lang } = useLocalize()
const { author, session } = useSession()
const { subscriptions } = useFollowing()
const [following, setFollowing] = createSignal<Array<Author | Topic>>([])
const [filtered, setFiltered] = createSignal<Array<Author | Topic>>([])

6
src/components/Views/PublishSettings/PublishSettings.tsx
View File

@ -127,10 +127,10 @@ export const PublishSettings = (props: Props) => {
}
const handlePublishSubmit = () => {
const shoutData = { ...props.form, ...settingsForm }
if (!shoutData?.mainTopic) {
showSnackbar({ body: t('Please, set the main topic first') })
} else {
if (shoutData?.mainTopic) {
publishShout(shoutData)
} else {
showSnackbar({ body: t('Please, set the main topic first') })
}
}
const handleSaveDraft = () => {

1
src/components/_shared/BadgeSubscribeButton/BadgeSubscribeButton.tsx
View File

@ -1,6 +1,5 @@
import { clsx } from 'clsx'
import { Show, createMemo } from 'solid-js'
import { useFollowing } from '../../../context/following'
import { useLocalize } from '../../../context/localize'
import { Button } from '../Button'
import stylesButton from '../Button/Button.module.scss'

2
src/components/_shared/Icon/index.ts
View File

@ -1 +1 @@
export * from './Icon'
export { Icon } from './Icon'

1
src/components/_shared/InviteMembers/InviteMembers.tsx
View File

@ -10,7 +10,6 @@ import { useAuthorsStore } from '../../../stores/zine/authors'
import { AuthorBadge } from '../../Author/AuthorBadge'
import { Button } from '../Button'
import { DropdownSelect } from '../DropdownSelect'
import { Loading } from '../Loading'
import { InlineLoader } from '../../InlineLoader'
import styles from './InviteMembers.module.scss'

2
src/components/_shared/Popup/index.ts
View File

@ -1 +1 @@
export * from './Popup'
export { Popup, type PopupProps } from './Popup'

4
src/components/_shared/SolidSwiper/ImageSwiper.tsx
View File

@ -57,11 +57,11 @@ export const ImageSwiper = (props: Props) => {
const { register } = await import('swiper/element/bundle')
register()
SwiperCore.use([Pagination, Navigation, Manipulation, HashNavigation])
while (!mainSwipeRef.current || !mainSwipeRef.current.swiper) {
while (!mainSwipeRef.current?.swiper) {
await new Promise((resolve) => setTimeout(resolve, 10)) // wait 10 ms
}
mainSwipeRef.current.swiper.on('slideChange', handleSlideChange)
const initialSlide = parseInt(searchParams().slide) - 1
const initialSlide = Number.parseInt(searchParams().slide) - 1
if (initialSlide && !Number.isNaN(initialSlide) && initialSlide < props.images.length) {
mainSwipeRef.current.swiper.slideTo(initialSlide, 0)
} else {

6
src/context/following.tsx
View File

@ -1,4 +1,4 @@
import { Accessor, JSX, createContext, createEffect, createMemo, createSignal, useContext } from 'solid-js'
import { Accessor, JSX, createContext, createEffect, createSignal, useContext } from 'solid-js'
import { createStore } from 'solid-js/store'
import { apiClient } from '../graphql/client/core'
@ -16,7 +16,7 @@ type SubscribeAction = { slug: string; type: 'subscribe' | 'unsubscribe' }
interface FollowingContextType {
loading: Accessor<boolean>
followers: Accessor<Array<Author>>
followers: Accessor<Author[]>
subscriptions: AuthorFollowsResult
setSubscriptions: (subscriptions: AuthorFollowsResult) => void
setFollowing: (what: FollowingEntity, slug: string, value: boolean) => void
@ -41,7 +41,7 @@ const EMPTY_SUBSCRIPTIONS: AuthorFollowsResult = {
export const FollowingProvider = (props: { children: JSX.Element }) => {
const [loading, setLoading] = createSignal<boolean>(false)
const [followers, setFollowers] = createSignal<Array<Author>>([])
const [followers, setFollowers] = createSignal<Author[]>([])
const [subscriptions, setSubscriptions] = createStore<AuthorFollowsResult>(EMPTY_SUBSCRIPTIONS)
const { author, session } = useSession()

10
src/context/session.tsx
View File

@ -72,6 +72,7 @@ export type SessionContextType = {
resendVerifyEmail: (params: ResendVerifyEmailInput) => Promise<GenericResponse>
}
// biome-ignore lint/suspicious/noEmptyBlockStatements: <explanation>
const noop = () => {}
const SessionContext = createContext<SessionContextType>()
@ -270,12 +271,9 @@ export const SessionProvider = (props: {
// callback state updater
createEffect(
on(
() => props.onStateChangeCallback,
() => {
props.onStateChangeCallback(session())
},
),
on([() => props.onStateChangeCallback, session], ([_, ses]) => {
ses?.user?.id && props.onStateChangeCallback(ses)
}),
)
const [authCallback, setAuthCallback] = createSignal<() => void>(noop)

4
src/context/topics.tsx
View File

@ -25,7 +25,7 @@ const setupIndexedDB = async () => {
})
}
const getTopicsFromIndexedDB = async (db) => {
const getTopicsFromIndexedDB = (db) => {
const tx = db.transaction(STORE_NAME, 'readonly')
const store = tx.objectStore(STORE_NAME)
return store.getAll()
@ -44,7 +44,7 @@ export const TopicsProvider = (props: { children: JSX.Element }) => {
onMount(async () => {
const db = await setupIndexedDB()
let topics = await getTopicsFromIndexedDB(db)
let topics = getTopicsFromIndexedDB(db)
if (topics.length === 0) {
topics = await apiClient.getAllTopics()

1
src/graphql/client/notifier.ts
View File

@ -1,4 +1,3 @@
import { createGraphQLClient } from '../createGraphQLClient'
import markSeenMutation from '../mutation/notifier/mark-seen'
import markSeenAfterMutation from '../mutation/notifier/mark-seen-after'
import markThreadSeenMutation from '../mutation/notifier/mark-seen-thread'

2
src/pages/allAuthors.page.tsx
View File

@ -1,6 +1,6 @@
import type { PageProps } from './types'
import { createEffect, createSignal, onMount } from 'solid-js'
import { createSignal, onMount } from 'solid-js'
import { AllAuthors } from '../components/Views/AllAuthors/'
import { PAGE_SIZE } from '../components/Views/AllTopics/AllTopics'

102
src/pages/edit.page.tsx
View File

@ -1,12 +1,12 @@
import { Show, Suspense, createMemo, createSignal, lazy, onMount } from 'solid-js'
import { Show, Suspense, createEffect, createMemo, createSignal, lazy, on, onMount } from 'solid-js'
import { AuthGuard } from '../components/AuthGuard'
import { Loading } from '../components/_shared/Loading'
import { PageLayout } from '../components/_shared/PageLayout'
import { useLocalize } from '../context/localize'
import { useSession } from '../context/session'
import { apiClient } from '../graphql/client/core'
import { Shout } from '../graphql/schema/core.gen'
import { useRouter } from '../stores/router'
import { router } from '../stores/router'
import { redirectPage } from '@nanostores/router'
@ -15,68 +15,70 @@ import { LayoutType } from './types'
const EditView = lazy(() => import('../components/Views/EditView/EditView'))
export const EditPage = () => {
const { page } = useRouter()
const snackbar = useSnackbar()
const { t } = useLocalize()
const getContentTypeTitle = (layout: LayoutType) => {
switch (layout) {
case 'audio':
return 'Publish Album'
case 'image':
return 'Create gallery'
case 'video':
return 'Create video'
case 'literature':
return 'New literary work'
default:
return 'Write an article'
}
}
const [shout, setShout] = createSignal<Shout>(null)
const loadMyShout = async (shout_id: number) => {
if (shout_id) {
const { shout: loadedShout, error } = await apiClient.getMyShout(shout_id)
console.log(loadedShout)
if (error) {
await snackbar?.showSnackbar({ type: 'error', body: t('This content is not published yet') })
redirectPage(router, 'drafts')
} else {
setShout(loadedShout)
}
}
export const EditPage = () => {
const { t } = useLocalize()
const { session } = useSession()
const snackbar = useSnackbar()
const fail = async (error: string) => {
console.error(error)
await snackbar?.showSnackbar({ type: 'error', body: t(error) })
redirectPage(router, 'drafts')
}
onMount(async () => {
const shout_id = window.location.pathname.split('/').pop()
if (shout_id) {
try {
await loadMyShout(parseInt(shout_id, 10))
} catch (e) {
console.error(e)
}
}
const [shoutId, setShoutId] = createSignal<number>(0)
const [shout, setShout] = createSignal<Shout>()
onMount(() => {
const shoutId = window.location.pathname.split('/').pop()
const shoutIdFromUrl = Number.parseInt(shoutId ?? '0', 10)
console.debug(`editing shout ${shoutIdFromUrl}`)
if (shoutIdFromUrl) setShoutId(shoutIdFromUrl)
})
createEffect(
on([session, shout, shoutId], async ([ses, sh, shid]) => {
if (ses?.user && !sh && shid) {
const { shout: loadedShout, error } = await apiClient.getMyShout(shid)
if (error) {
fail(error)
} else {
setShout(loadedShout)
}
}
}),
)
const title = createMemo(() => {
if (!shout()) {
return t('Create post')
}
switch (shout().layout as LayoutType) {
case 'audio': {
return t('Publish Album')
}
case 'image': {
return t('Create gallery')
}
case 'video': {
return t('Create video')
}
case 'literature': {
return t('New literary work')
}
default: {
return t('Write an article')
}
}
return t(getContentTypeTitle(shout()?.layout as LayoutType))
})
return (
<PageLayout title={title()}>
<AuthGuard>
<Show when={shout()}>
<Suspense fallback={<Loading />}>
<EditView shout={shout()} />
</Suspense>
</Show>
<Suspense fallback={<Loading />}>
<Show when={shout()} fallback={<Loading />}>
<EditView shout={shout() as Shout} />
</Show>
</Suspense>
</AuthGuard>
</PageLayout>
)

3
src/stores/router.ts
View File

@ -69,7 +69,8 @@ const checkOpenOnClient = (link: HTMLAnchorElement, event) => {
)
}
const scrollToHash = (hash: string) => {
// TODO: use scrollToHash or remove
const _scrollToHash = (hash: string) => {
let selector = hash
if (/^#\d+/.test(selector)) {

6
src/stores/zine/authors.ts
View File

@ -1,13 +1,13 @@
import { createLazyMemo } from '@solid-primitives/memo'
import { createEffect, createSignal } from 'solid-js'
import { createSignal } from 'solid-js'
import { apiClient } from '../../graphql/client/core'
import { Author, QueryLoad_Authors_ByArgs } from '../../graphql/schema/core.gen'
export type AuthorsSortBy = 'shouts' | 'name' | 'followers'
type SortedAuthorsSetter = (prev: Author[]) => Author[]
const [sortAllBy, setSortAllBy] = createSignal<AuthorsSortBy>('name')
// FIXME: use signal or remove
const [_sortAllBy, setSortAllBy] = createSignal<AuthorsSortBy>('name')
export const setAuthorsSort = (sortBy: AuthorsSortBy) => setSortAllBy(sortBy)

1
src/utils/getRandomTopicsFromArray.ts
View File

@ -2,6 +2,7 @@ import { RANDOM_TOPICS_COUNT } from '../components/Views/Home'
import { Topic } from '../graphql/schema/core.gen'
export const getRandomTopicsFromArray = (topics: Topic[], count: number = RANDOM_TOPICS_COUNT): Topic[] => {
if (!Array.isArray(topics)) return []
const shuffledTopics = [...topics].sort(() => 0.5 - Math.random())
return shuffledTopics.slice(0, count)
}

14
vite.config.ts
View File

@ -1,6 +1,7 @@
import ssrPlugin from 'vike/plugin'
import { defineConfig, splitVendorChunkPlugin } from 'vite'
import mkcert from 'vite-plugin-mkcert'
import { nodePolyfills } from 'vite-plugin-node-polyfills';
import sassDts from 'vite-plugin-sass-dts'
import solidPlugin from 'vite-plugin-solid'
@ -40,6 +41,19 @@ export default defineConfig(({ mode, command }) => {
ssrPlugin({ includeAssetsImportedByServer: true }),
sassDts(),
cssModuleHMR(),
nodePolyfills({
include: ['path', 'stream', 'util'],
exclude: ['http'],
globals: {
Buffer: true,
//global: true,
//process: true,
},
overrides: {
fs: 'memfs',
},
protocolImports: true,
}),
]
if (command === 'serve') {