simplify vitreum headtags stupid file

This commit is contained in:
Víctor Losada Hernández
2026-09-28 17:55:13 +02:00
parent ae043ca6ce
commit c640189041
+10 -73
View File
@@ -1,91 +1,28 @@
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
//old vitreum file, still imported in some pages const obj2props = (obj) =>
Object.entries(obj)
const injectTag = (tag, props, children)=>{
const injectNode = document.createElement(tag);
Object.entries(props).forEach(([key, val])=>injectNode[key] = val);
if(children) injectNode.appendChild(document.createTextNode(children));
document.getElementsByTagName('head')[0].appendChild(injectNode);
};
const obj2props = (obj)=>Object.entries(obj)
.map(([k, v]) => `${k}="${v}"`) .map(([k, v]) => `${k}="${v}"`)
.join(' '); .join(' ');
const toStr = (chld)=>(Array.isArray(chld) ? chld.join('') : chld);
const onServer = typeof window === 'undefined';
let NamedTags = {}; let NamedTags = {};
let UnnamedTags = [];
export const HeadComponents = { const HeadComponents = {
Title({ children }) {
if(onServer) NamedTags.title = `<title>${toStr(children)}</title>`;
useEffect(()=>{
document.title = toStr(children);
}, [children]);
return null;
},
Favicon({ type = 'image/png', href = '', rel = 'icon', id = 'favicon' }) {
if(onServer) NamedTags.favicon = `<link rel='shortcut icon' type="${type}" id="${id}" href="${href}" />`;
useEffect(()=>{
document.getElementById(id).href = href;
}, [id, href]);
return null;
},
Description({ children }) {
if(onServer) NamedTags.description = `<meta name='description' content='${toStr(children)}' />`;
return null;
},
Noscript({ children }) {
if(onServer) UnnamedTags.push(`<noscript>${toStr(children)}</noscript>`);
return null;
},
Script({ children = [], ...props }) {
if(onServer) {
UnnamedTags.push(
children.length
? `<script ${obj2props(props)}>${toStr(children)}</script>`
: `<script ${obj2props(props)} />`,
);
}
return null;
},
Meta(props) { Meta(props) {
const tag = `<meta ${obj2props(props)} />`; const tag = `<meta ${obj2props(props)} />`;
props.property || props.name ? (NamedTags[props.property || props.name] = tag) : UnnamedTags.push(tag);
props.property || props.name
? (NamedTags[props.property || props.name] = tag)
: null;
useEffect(() => { useEffect(() => {
document document
.getElementsByTagName('head')[0] .getElementsByTagName('head')[0]
.insertAdjacentHTML('beforeend', Object.values(NamedTags).join('\n')); .insertAdjacentHTML('beforeend', Object.values(NamedTags).join('\n'));
}, [NamedTags]); }, [NamedTags]);
return null;
},
Style({ children, type = 'text/css' }) {
if(onServer) UnnamedTags.push(`<style type="${type}">${toStr(children)}</style>`);
return null; return null;
}, },
}; };
export const Inject = ({ tag, children, ...props })=>{ export default HeadComponents;
useEffect(()=>{
injectTag(tag, props, children);
}, []);
return null;
};
export const generate = ()=>Object.values(NamedTags).concat(UnnamedTags).join('\n');
export const flush = ()=>{
NamedTags = {};
UnnamedTags = [];
};
export const Meta = HeadComponents.Meta;
export default {
Inject,
...HeadComponents,
generate,
flush,
};