Merge branch 'chores' into 'dev'

build fix, chores: lib updates, lint

See merge request discoursio/discoursio-webapp!35

.github/workflows/node-ci.yml

@@ -9,13 +9,10 @@ jobs:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: '16'
+          node-version: '18'
 
       - name: Install deps
         run: npm install
 
-      - name: Lint
+      - name: Check
-        run: npm run lint
+        run: npm run check
-
-      - name: Type check
-        run: npm run typecheck

package.json

@@ -9,7 +9,6 @@
     "codegen": "graphql-codegen",
     "deploy": "graphql-codegen && npm run typecheck && vite build && vercel",
     "dev": "vite",
-    "ffix": "npm run fix && npm run format",
     "fix": "npm run lint:code:fix && npm run lint:styles:fix",
     "format": "npx prettier \"{,!(node_modules)/**/}*.{js,ts,tsx,json,scss,css}\" --write --ignore-path .gitignore",
     "lint": "npm run lint:code && npm run lint:styles",
@@ -18,7 +17,6 @@
     "lint:styles": "stylelint **/*.{scss,css}",
     "lint:styles:fix": "stylelint **/*.{scss,css} --fix",
     "pre-commit": "lint-staged",
-    "pre-commit-old": "lint-staged",
     "pre-push": "",
     "pre-push-old": "npm run typecheck",
     "prepare": "husky install",
@@ -31,55 +29,55 @@
     "typecheck:watch": "tsc --noEmit --watch"
   },
   "dependencies": {
-    "@aws-sdk/abort-controller": "^3.266.0",
+    "@aws-sdk/abort-controller": "^3.272.0",
-    "@aws-sdk/client-s3": "^3.216.0",
+    "@aws-sdk/client-s3": "^3.282.0",
-    "@aws-sdk/lib-storage": "^3.266.0",
+    "@aws-sdk/lib-storage": "^3.282.0",
     "formidable": "^2.1.1",
-    "i18next": "^22.4.9",
+    "i18next": "^22.4.10",
-    "mailgun.js": "^8.0.6"
+    "mailgun.js": "^8.2.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.20.12",
+    "@babel/core": "^7.21.0",
-    "@graphql-codegen/cli": "^3.0.0",
+    "@graphql-codegen/cli": "^3.2.1",
-    "@graphql-codegen/typescript": "^3.0.0",
+    "@graphql-codegen/typescript": "^3.0.1",
-    "@graphql-codegen/typescript-operations": "^3.0.0",
+    "@graphql-codegen/typescript-operations": "^3.0.1",
     "@graphql-codegen/typescript-urql": "^3.7.3",
     "@graphql-codegen/urql-introspection": "^2.2.1",
     "@graphql-tools/url-loader": "^7.17.13",
-    "@graphql-typed-document-node/core": "^3.1.1",
+    "@graphql-typed-document-node/core": "^3.1.2",
     "@nanostores/router": "^0.8.1",
     "@nanostores/solid": "^0.3.2",
     "@popperjs/core": "^2.11.6",
-    "@solid-primitives/memo": "^1.1.3",
+    "@solid-primitives/memo": "^1.2.0",
-    "@solid-primitives/share": "^2.0.1",
+    "@solid-primitives/share": "^2.0.3",
-    "@solid-primitives/storage": "^1.3.4",
+    "@solid-primitives/storage": "^1.3.7",
-    "@solid-primitives/upload": "^0.0.107",
+    "@solid-primitives/upload": "^0.0.109",
     "@solidjs/meta": "^0.28.2",
     "@types/express": "^4.17.15",
-    "@types/node": "^18.11.18",
+    "@types/node": "^18.14.6",
-    "@types/uuid": "^9.0.0",
+    "@types/uuid": "^9.0.1",
-    "@typescript-eslint/eslint-plugin": "^5.52.0",
+    "@typescript-eslint/eslint-plugin": "^5.54.0",
-    "@typescript-eslint/parser": "^5.52.0",
+    "@typescript-eslint/parser": "^5.54.0",
     "@urql/core": "^3.1.1",
     "@urql/devtools": "^2.0.3",
-    "@urql/exchange-graphcache": "^5.0.8",
+    "@urql/exchange-graphcache": "^5.0.9",
     "babel-preset-solid": "^1.5.6",
     "bcryptjs": "^2.4.3",
     "bootstrap": "^5.2.3",
     "clsx": "^1.2.1",
     "cookie": "^0.5.0",
-    "cookie-signature": "^1.2.0",
+    "cookie-signature": "^1.2.1",
     "cosmiconfig-toml-loader": "^1.0.0",
     "cross-env": "^7.0.3",
-    "eslint": "^8.34.0",
+    "eslint": "^8.35.0",
     "eslint-config-stylelint": "^18.0.0",
     "eslint-import-resolver-typescript": "^3.5.3",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-solid": "^0.9.4",
+    "eslint-plugin-solid": "^0.10.0",
     "eslint-plugin-sonarjs": "^0.18.0",
-    "eslint-plugin-unicorn": "^45.0.2",
+    "eslint-plugin-unicorn": "^46.0.0",
     "graphql": "^16.6.0",
     "graphql-tag": "^2.12.6",
     "graphql-ws": "^5.11.2",
@@ -88,7 +86,7 @@
     "hygen": "^6.2.11",
     "i18next-http-backend": "^2.1.1",
     "idb": "^7.1.1",
-    "jest": "^29.3.1",
+    "jest": "^29.4.3",
     "js-cookie": "^3.0.1",
     "lint-staged": "^13.1.2",
     "loglevel": "^1.8.1",
@@ -98,12 +96,12 @@
     "markdown-it-implicit-figures": "^0.11.0",
     "markdown-it-mark": "^3.0.1",
     "markdown-it-replace-link": "^1.1.0",
-    "nanostores": "^0.7.1",
+    "nanostores": "^0.7.4",
     "orderedmap": "^2.1.0",
     "prettier": "^2.7.1",
     "prettier-eslint": "^15.0.1",
-    "prosemirror-commands": "^1.5.0",
+    "prosemirror-commands": "^1.5.1",
-    "prosemirror-dropcursor": "^1.6.1",
+    "prosemirror-dropcursor": "^1.7.1",
     "prosemirror-example-setup": "^1.2.1",
     "prosemirror-gapcursor": "^1.3.1",
     "prosemirror-history": "^1.3.0",
@@ -115,13 +113,13 @@
     "prosemirror-schema-list": "^1.2.2",
     "prosemirror-state": "^1.4.2",
     "prosemirror-view": "^1.30.0",
-    "rollup": "^3.15.0",
+    "rollup": "^3.18.0",
     "rollup-plugin-visualizer": "^5.9.0",
-    "sass": "^1.58.1",
+    "sass": "^1.58.3",
     "solid-js": "^1.6.11",
     "solid-transition-group": "^0.0.13",
     "sort-package-json": "^2.3.0",
-    "stylelint": "^15.1.0",
+    "stylelint": "^15.2.0",
     "stylelint-config-css-modules": "^4.1.0",
     "stylelint-config-prettier-scss": "^0.0.1",
     "stylelint-config-standard-scss": "^7.0.1",
@@ -130,18 +128,18 @@
     "swiper": "^8.4.7",
     "ts-node": "^10.9.1",
     "typescript": "^4.9.4",
-    "undici": "^5.19.1",
+    "undici": "^5.20.0",
     "unique-names-generator": "^4.7.1",
     "uuid": "^9.0.0",
-    "vite": "^4.1.1",
+    "vite": "^4.1.4",
-    "vite-plugin-sass-dts": "^1.2.15",
+    "vite-plugin-sass-dts": "^1.2.16",
-    "vite-plugin-solid": "^2.3.8",
+    "vite-plugin-solid": "^2.6.1",
-    "vite-plugin-ssr": "^0.4.38",
+    "vite-plugin-ssr": "^0.4.90",
     "wonka": "^6.2.3",
     "ws": "^8.12.1",
     "y-prosemirror": "^1.2.0",
     "y-protocols": "^1.0.5",
     "y-webrtc": "^10.2.4",
-    "yjs": "^13.5.44"
+    "yjs": "^13.5.48"
   }
 }

src/components/App.tsx

@@ -2,7 +2,7 @@
 // import 'solid-devtools'
 
 import { MODALS, showModal } from '../stores/ui'
-import { Component, createEffect, createMemo, Suspense } from 'solid-js'
+import { Component, createEffect, createMemo } from 'solid-js'
 import { ROUTES, useRouter } from '../stores/router'
 import { Dynamic } from 'solid-js/web'
 
@@ -72,14 +72,14 @@ const pagesMap: Record<keyof typeof ROUTES, Component<PageProps>> = {
 
 export const App = (props: PageProps) => {
   const { page, searchParams } = useRouter<RootSearchParams>()
-  // console.debug(page())
+
   createEffect(() => {
     const modal = MODALS[searchParams().modal]
     if (modal) {
       showModal(modal)
     }
   })
-  // console.debug(pagesMap)
+
   const pageComponent = createMemo(() => {
     const result = pagesMap[page()?.route || 'home']
 

src/components/Article/CommentsTree.tsx

@@ -2,7 +2,6 @@ import { Show, createMemo, createSignal, onMount, For } from 'solid-js'
 import { Comment } from './Comment'
 import styles from '../../styles/Article.module.scss'
 import { clsx } from 'clsx'
-import { Loading } from '../_shared/Loading'
 import { Author, Reaction, ReactionKind } from '../../graphql/types.gen'
 import { useSession } from '../../context/session'
 import CommentEditor from '../_shared/CommentEditor'
@@ -15,6 +14,25 @@ import Cookie from 'js-cookie'
 
 type CommentsOrder = 'createdAt' | 'rating' | 'newOnly'
 
+const sortCommentsByRating = (a: Reaction, b: Reaction): -1 | 0 | 1 => {
+  if (a.replyTo && b.replyTo) {
+    return 0
+  }
+
+  const x = (a?.stat && a.stat.rating) || 0
+  const y = (b?.stat && b.stat.rating) || 0
+
+  if (x > y) {
+    return 1
+  }
+
+  if (x < y) {
+    return -1
+  }
+
+  return 0
+}
+
 type Props = {
   commentAuthors: Author[]
   shoutSlug: string
@@ -41,28 +59,12 @@ export const CommentsTree = (props: Props) => {
     let newSortedComments = [...comments()]
     newSortedComments = newSortedComments.sort(byCreated)
 
-    if (commentsOrder() === 'rating') {
+    if (commentsOrder() === 'newOnly') {
-      newSortedComments = newSortedComments.sort((a, b) => {
+      return newReactions().reverse()
-        if (a.replyTo && b.replyTo) {
-          return 0
-        }
-
-        const x = (a?.stat && a.stat.rating) || 0
-        const y = (b?.stat && b.stat.rating) || 0
-
-        if (x > y) {
-          return 1
-        }
-        if (x < y) {
-          return -1
-        }
-
-        return 0
-      })
     }
 
-    if (commentsOrder() === 'newOnly') {
+    if (commentsOrder() === 'rating') {
-      newSortedComments = newReactions()
+      newSortedComments = newSortedComments.sort(sortCommentsByRating)
     }
 
     newSortedComments.reverse()

src/components/Article/ShoutRatingControl.tsx

@@ -1,13 +1,10 @@
 import styles from './ShoutRatingControl.module.scss'
 import { clsx } from 'clsx'
-import { createMemo, For, Match, Switch } from 'solid-js'
+import { createMemo, For } from 'solid-js'
-import { Author, ReactionKind, Shout } from '../../graphql/types.gen'
+import { ReactionKind, Shout } from '../../graphql/types.gen'
 import { loadShout } from '../../stores/zine/articles'
 import { useSession } from '../../context/session'
 import { useReactions } from '../../context/reactions'
-import { Button } from '../_shared/Button'
-import Userpic from '../Author/Userpic'
-import { AuthorCard } from '../Author/Card'
 import { Popup } from '../_shared/Popup'
 
 interface ShoutRatingControlProps {

src/components/Discours/Footer.tsx

@@ -1,4 +1,4 @@
-import { createEffect, createMemo, For } from 'solid-js'
+import { createMemo, For } from 'solid-js'
 import styles from './Footer.module.scss'
 import { Icon } from '../_shared/Icon'
 import Subscribe from './Subscribe'

src/components/Feed/Card.tsx

@@ -12,7 +12,6 @@ import stylesHeader from '../Nav/Header.module.scss'
 import { getDescription } from '../../utils/meta'
 import { FeedArticlePopup } from './FeedArticlePopup'
 import { useLocalize } from '../../context/localize'
-import { useReactions } from '../../context/reactions'
 
 interface ArticleCardProps {
   settings?: {

src/components/Nav/Topics.tsx

@@ -1,4 +1,4 @@
-import { createMemo, For, Show } from 'solid-js'
+import { For, Show } from 'solid-js'
 import type { Topic } from '../../graphql/types.gen'
 import { Icon } from '../_shared/Icon'
 import './Topics.scss'

src/components/Views/Feed.tsx

@@ -1,26 +1,23 @@
 import { createEffect, createMemo, createSignal, For, onMount, Show } from 'solid-js'
 import '../../styles/Feed.scss'
-import stylesBeside from '../../components/Feed/Beside.module.scss'
 import { Icon } from '../_shared/Icon'
 import { ArticleCard } from '../Feed/Card'
 import { AuthorCard } from '../Author/Card'
-
 import { FeedSidebar } from '../Feed/Sidebar'
-import { Comment as CommentCard } from '../Article/Comment'
 import { loadShouts, useArticlesStore } from '../../stores/zine/articles'
 import { useAuthorsStore } from '../../stores/zine/authors'
 import { useTopicsStore } from '../../stores/zine/topics'
 import { useTopAuthorsStore } from '../../stores/zine/topAuthors'
 import { useSession } from '../../context/session'
-import stylesTopic from '../Feed/CardTopic.module.scss'
-import styles from './Feed.module.scss'
 import { clsx } from 'clsx'
 import { useReactions } from '../../context/reactions'
-import type { Reaction } from '../../graphql/types.gen'
+import type { Author, Reaction } from '../../graphql/types.gen'
 import { getPagePath } from '@nanostores/router'
 import { router } from '../../stores/router'
 import { useLocalize } from '../../context/localize'
-import type { Author } from '../../graphql/types.gen'
+import styles from './Feed.module.scss'
+import stylesTopic from '../Feed/CardTopic.module.scss'
+import stylesBeside from '../../components/Feed/Beside.module.scss'
 
 export const FEED_PAGE_SIZE = 20
 

src/components/_shared/StatMetrics.tsx

@@ -1,4 +1,4 @@
-import { createMemo, For } from 'solid-js'
+import { For } from 'solid-js'
 import type { Stat, TopicStat } from '../../graphql/types.gen'
 import { plural } from '../../utils'
 import styles from './Stat.module.scss'