14337850582

Committed 08 Apr 2025 03:43PM UTC coverage: 32.148% (-0.9%) from 33.016%

Build # 14337850582

Build Type

push

github

Committed by

web-flow

Commit Message

Page d'accueil (#1382)

* feat(home): première ébauche de page

* fix: supprime le layout à scroll par défaut

Ça gêne les captures d'écran.

* feat(home): reformulations de l'accueil

* feat(home): internationalisation

* feat(home): redirige vers le login après logout et vers les articles après login/inscription

---------

Co-authored-by: Thomas Parisot <thom4parisot@users.noreply.github.com>

Coverage Stats

476 of 712 branches covered (66.85%)

Branch coverage included in aggregate %.

11 of 614 new or added lines in 9 files covered. (1.79%)

2 existing lines in 2 files now uncovered.

4505 of 14782 relevant lines covered (30.48%)

2.27 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/front/src/components/Header.jsx

import React, { useMemo } from 'react'
import { LifeBuoy } from 'lucide-react'
import { useSelector } from 'react-redux'
import { NavLink, Route, Switch } from 'react-router-dom'
import { useTranslation } from 'react-i18next'

import logoContent from '/images/logo.svg?inline'
import { useActiveWorkspace } from '../hooks/workspace.js'

import styles from './header.module.scss'
import LanguagesMenu from './header/LanguagesMenu.jsx'
import UserMenu from './header/UserMenu.jsx'

export default function Header() {
  const { t } = useTranslation()
  const activeWorkspace = useActiveWorkspace()
  const activeWorkspaceId = useMemo(
    () => activeWorkspace?._id,
    [activeWorkspace]
  )

  const baseUrl = useMemo(
    () => (activeWorkspaceId ? `/workspaces/${activeWorkspaceId}` : ''),
    [activeWorkspaceId]
  )
  const connected = useSelector((state) => state.loggedIn)

  return (
    <Switch>
      <Route path="*/preview" />
      <Route path="/credentials/auth-callback" />
      <Route path="*">
        <header className={styles.headerContainer} role="banner">
          <section className={styles.header}>
            <h1 className={styles.logo}>
              <NavLink to="/" rel="home">
                <img src={logoContent} alt="Stylo" title="Stylo" />
              </NavLink>
            </h1>
            <nav role="navigation">
              <ul className={styles.menuLinks}>
                {connected && (
                  <li>
                    <NavLink to={`${baseUrl}/articles`}>
                      {t('header.articles.link')}
                    </NavLink>
                  </li>
                )}
                {connected && (
                  <li>
                    <NavLink to={`${baseUrl}/corpus`}>
                      {t('header.corpus.link')}
                    </NavLink>
                  </li>
                )}
                {!connected && (
                  <li>
                    <NavLink to="/login">
                      {t('credentials.login.confirmButton')}
                    </NavLink>
                  </li>
                )}
                {!connected && (
                  <li>
                    <NavLink to="/register" className={styles.registerAction}>
                      {t('credentials.login.registerLink')}
                    </NavLink>
                  </li>
                )}
              </ul>
            </nav>
            <nav className={styles.secondaryNav}>
              {connected && <UserMenu />}
              <a
                className={styles.documentationLink}
                href="https://stylo-doc.ecrituresnumeriques.ca"
                target="_blank"
                rel="noopener noreferrer"
              >
                <LifeBuoy size={16} aria-hidden />
                {t('header.documentation.link')}
              </a>
              <LanguagesMenu />
            </nav>
          </section>
        </header>
      </Route>
    </Switch>
  )
}

1	import React, { useMemo } from 'react'	×
2	import { LifeBuoy } from 'lucide-react'	×
3	import { useSelector } from 'react-redux'	×
4	import { NavLink, Route, Switch } from 'react-router-dom'	×
5	import { useTranslation } from 'react-i18next'	×
6
7	import logoContent from '/images/logo.svg?inline'	×
8	import { useActiveWorkspace } from '../hooks/workspace.js'	×
9
10	import styles from './header.module.scss'	×
11	import LanguagesMenu from './header/LanguagesMenu.jsx'	×
12	import UserMenu from './header/UserMenu.jsx'	×
13
14	export default function Header() {	×
15	const { t } = useTranslation()	×
16	const activeWorkspace = useActiveWorkspace()	×
17	const activeWorkspaceId = useMemo(	×
18	() => activeWorkspace?._id,	×
19	[activeWorkspace]	×
20	)	×
21
22	const baseUrl = useMemo(	×
23	() => (activeWorkspaceId ? `/workspaces/${activeWorkspaceId}` : ''),	×
24	[activeWorkspaceId]	×
25	)	×
26	const connected = useSelector((state) => state.loggedIn)	×
27
28	return (	×
29	<Switch>	×
30	<Route path="*/preview" />	×
31	<Route path="/credentials/auth-callback" />	×
32	<Route path="*">	×
33	<header className={styles.headerContainer} role="banner">	×
34	<section className={styles.header}>	×
35	<h1 className={styles.logo}>	×
NEW 36	<NavLink to="/" rel="home">	×
37	<img src={logoContent} alt="Stylo" title="Stylo" />	×
38	</NavLink>	×
39	</h1>	×
40	<nav role="navigation">	×
41	<ul className={styles.menuLinks}>	×
42	{connected && (	×
43	<li>	×
44	<NavLink to={`${baseUrl}/articles`}>	×
45	{t('header.articles.link')}	×
46	</NavLink>	×
47	</li>	×
48	)}
49	{connected && (	×
50	<li>	×
51	<NavLink to={`${baseUrl}/corpus`}>	×
52	{t('header.corpus.link')}	×
53	</NavLink>	×
54	</li>	×
55	)}
56	{!connected && (	×
57	<li>	×
NEW 58	<NavLink to="/login">	×
59	{t('credentials.login.confirmButton')}	×
60	</NavLink>	×
61	</li>	×
62	)}
63	{!connected && (	×
64	<li>	×
65	<NavLink to="/register" className={styles.registerAction}>	×
66	{t('credentials.login.registerLink')}	×
67	</NavLink>	×
68	</li>	×
69	)}
70	</ul>	×
71	</nav>	×
72	<nav className={styles.secondaryNav}>	×
73	{connected && <UserMenu />}	×
74	<a	×
75	className={styles.documentationLink}	×
76	href="https://stylo-doc.ecrituresnumeriques.ca"	×
77	target="_blank"	×
78	rel="noopener noreferrer"	×
79	>
80	<LifeBuoy size={16} aria-hidden />	×
81	{t('header.documentation.link')}	×
82	</a>	×
83	<LanguagesMenu />	×
84	</nav>	×
85	</section>	×
86	</header>	×
87	</Route>	×
88	</Switch>	×
89	)
90	}	×

EcrituresNumeriques / stylo / 14337850582

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous