Skip to content

Commit

Permalink
Removed unecessary function. I definitely overcomplicated the origina…
Browse files Browse the repository at this point in the history
…l solution. All that's really needed to make this performant is a few css changes and changing data-Expanded from a React state variable that triggers a re-render to an attribute on a ref
  • Loading branch information
cmhhelgeson committed Jan 4, 2024
1 parent 212401f commit efedad9
Showing 1 changed file with 3 additions and 9 deletions.
12 changes: 3 additions & 9 deletions src/pages/_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,7 @@ const MainLayout: React.FunctionComponent<AppProps> = ({
const samplesNames = Object.keys(pages);

const panelRef = useRef<HTMLDivElement>(null);

const stylePanelContentsOnExpand = () => {
const setDataExpanded = () => {
if (panelRef.current) {
console.log(panelRef.current.getAttribute('data-expanded'));
panelRef.current.getAttribute('data-expanded') === 'true'
Expand All @@ -33,11 +32,6 @@ const MainLayout: React.FunctionComponent<AppProps> = ({
}
};

//Style .panelContents when clicking on a link.
const stylePanelContentsOnLink = () => {
panelRef.current.setAttribute('data-expanded', 'false');
};

const oldPathSyntaxMatch = router.asPath.match(/(\?wgsl=[01])#(\S+)/);
if (oldPathSyntaxMatch) {
const slug = oldPathSyntaxMatch[2];
Expand Down Expand Up @@ -65,7 +59,7 @@ const MainLayout: React.FunctionComponent<AppProps> = ({
<div
className={styles.expand}
onClick={() => {
stylePanelContentsOnExpand();
setDataExpanded();
}}
></div>
</h1>
Expand All @@ -92,7 +86,7 @@ const MainLayout: React.FunctionComponent<AppProps> = ({
<Link
href={`/samples/${slug}`}
onClick={() => {
stylePanelContentsOnLink();
setDataExpanded();
}}
>
{slug}
Expand Down

0 comments on commit efedad9

Please sign in to comment.