juyung/devscard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: remove direct sections import in hash-state util

Browse source
This commit is contained in:
Konrad Szwarc 2023-02-01 14:06:00 +01:00
parent 4f137e2a92
commit 91121fcf8a
6 changed files with 38 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/pages/index.astro
View file

@ -14,7 +14,7 @@ import cv from '@/data';
const { config, sections } = cv(); const { config, sections } = cv();
--- ---
<Layout {...config}> <Layout {...config} sections={sections}>
<ThemeToggle /> <ThemeToggle />
<main class="w-full max-w-5xl space-y-4 px-2 py-3 sm:space-y-6 sm:px-8 sm:py-12 lg:space-y-8 lg:py-20"> <main class="w-full max-w-5xl space-y-4 px-2 py-3 sm:space-y-6 sm:px-8 sm:py-12 lg:space-y-8 lg:py-20">
<MainSection {...sections.main} /> <MainSection {...sections.main} />

8
src/types/data.ts
View file

@ -9,7 +9,7 @@ import type { PortfolioSection } from './sections/portfolio-section.types';
import type { SkillsSection } from './sections/skills-section.types'; import type { SkillsSection } from './sections/skills-section.types';
import type { TestimonialsSection } from './sections/testimonials-section.types'; import type { TestimonialsSection } from './sections/testimonials-section.types';
export interface Config { export type Config = {
/** /**
* [WEB] Page metadata used for SEO and social media sharing. * [WEB] Page metadata used for SEO and social media sharing.
*/ */
@ -24,9 +24,9 @@ export interface Config {
* [PDF] Configuration of the pdf generation. * [PDF] Configuration of the pdf generation.
*/ */
pdf?: PdfConfig; pdf?: PdfConfig;
} };
export interface Sections { export type Sections = {
/** /**
* Basic information about you. * Basic information about you.
*/ */
@ -61,7 +61,7 @@ export interface Sections {
* [WEB] List of sources you use to gain knowledge and inspiration. * [WEB] List of sources you use to gain knowledge and inspiration.
*/ */
favorites: FavoritesSection; favorites: FavoritesSection;
} };
/** /**
* All data used to generate the cv. * All data used to generate the cv.

10
src/web/components/layout.astro
View file

@ -1,15 +1,17 @@
--- ---
import type { Data } from '@/types/data'; import type { Config, Sections } from '@/types/data';
import Head from '@/web/head/head.astro'; import Head from '@/web/head/head.astro';
export interface Props extends Pick<Data['config'], 'meta' | 'i18n'> {} export interface Props extends Config {
sections: Sections;
}
const { meta, i18n } = Astro.props; const { meta, i18n, sections } = Astro.props;
--- ---
<!DOCTYPE html> <!DOCTYPE html>
<html lang={i18n.locale.code} class="scroll-smooth"> <html lang={i18n.locale.code} class="scroll-smooth">
<Head meta={meta} /> <Head meta={meta} sections={sections} />
<body class="flex justify-center overflow-x-hidden bg-gray-50 dark:bg-gray-900 xl:relative xl:left-7"> <body class="flex justify-center overflow-x-hidden bg-gray-50 dark:bg-gray-900 xl:relative xl:left-7">
<slot /> <slot />
</body> </body>

6
src/web/head/head.astro
View file

@ -1,20 +1,24 @@
--- ---
import Fonts from '@/components/fonts.astro'; import Fonts from '@/components/fonts.astro';
import type { MetaConfig } from '@/types/config/meta-config.types'; import type { MetaConfig } from '@/types/config/meta-config.types';
import type { Sections } from '@/types/data';
import Favicons from './favicons.generated.astro'; import Favicons from './favicons.generated.astro';
import InitialHash from './initial-hash.astro';
import InitialTheme from './initial-theme.astro'; import InitialTheme from './initial-theme.astro';
import Meta from './meta.astro'; import Meta from './meta.astro';
interface Props { interface Props {
meta: MetaConfig; meta: MetaConfig;
sections: Sections;
} }
const { meta } = Astro.props; const { meta, sections } = Astro.props;
--- ---
<head> <head>
<Meta meta={meta} /> <Meta meta={meta} />
<Favicons /> <Favicons />
<InitialHash sections={sections} />
<InitialTheme /> <InitialTheme />
<Fonts /> <Fonts />
</head> </head>

17
src/web/head/initial-hash.astro Normal file
View file

@ -0,0 +1,17 @@
---
import type { Sections } from '@/types/data';
interface Props {
sections: Sections;
}
const { sections } = Astro.props;
const firstVisibleSection = Object.values(sections).find((section) => section.config.visible);
const firstVisibleSectionSlug = firstVisibleSection?.config.slug;
---
{/* Used in src/web/utils/hash-state.ts */}
<script is:inline define:vars={{ firstVisibleSectionSlug }}>
window.firstVisibleSectionSlug = firstVisibleSectionSlug;
</script>

10
src/web/utils/hash-state.ts
View file

@ -1,14 +1,14 @@
import sections from '@/data/sections';
import { isServer } from './env'; import { isServer } from './env';
// Set in src/web/head/initial-hash.astro
declare let window: Window & { firstVisibleSectionSlug?: string };
const getInitialHash = () => { const getInitialHash = () => {
if (isServer) return ''; if (isServer) return '';
const firstVisibleSection = Object.values(sections).find((section) => section.config.visible); if (window.location.hash) return window.location.hash;
if (!firstVisibleSection) return ''; return window.firstVisibleSectionSlug ? `#${window.firstVisibleSectionSlug}` : '';
return window.location.hash || `#${firstVisibleSection.config.slug}`;
}; };
const createHashState = () => { const createHashState = () => {