diff --git a/src/app/components/Tag.tsx b/src/app/components/Tag.tsx
new file mode 100644
index 0000000..3fe61dd
--- /dev/null
+++ b/src/app/components/Tag.tsx
@@ -0,0 +1,7 @@
+import React from "react"
+
+export default function Tag(props: {text: string}) {
+ return (
+ {props.text}
+ )
+}
\ No newline at end of file
diff --git a/src/app/components/TagCloud.tsx b/src/app/components/TagCloud.tsx
index 07db133..556051c 100644
--- a/src/app/components/TagCloud.tsx
+++ b/src/app/components/TagCloud.tsx
@@ -1,6 +1,7 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React from 'react';
import Container from 'react-bootstrap/Container';
-import { useAutoFocus, useFocusedElement } from '../hooks/FocusedElement';
+import { useAutoFocus } from '../hooks/FocusedElement';
+import Tag from './Tag';
export type Props = {
title: string,
@@ -9,14 +10,6 @@ export type Props = {
style?: 'primary' | 'light'
}
-function Tag(props: {text: string}) {
- const tagKey = 'tag ' + props.text;
- const elementRef = useAutoFocus(tagKey)
- return (
- {props.text}
- )
-}
-
export default function TagCloud(props: Props) {
const focusRef = useAutoFocus('tags ' + props.title)
const containerClasses = ['tag-cloud', 'cloud-' + (props.style || 'standard')]
diff --git a/src/app/components/job/JobCard.tsx b/src/app/components/job/JobCard.tsx
index 461cd05..3e46d1e 100644
--- a/src/app/components/job/JobCard.tsx
+++ b/src/app/components/job/JobCard.tsx
@@ -2,7 +2,7 @@ import React from 'react';
import Card from 'react-bootstrap/Card';
import { useAutoFocus } from '../../hooks/FocusedElement';
import { Placeholder } from 'react-bootstrap';
-import JobTags from './JobTags';
+import JobTags, { focusKeyPlaceholder } from './JobTags';
import { Job } from '@/PersonalDataTypes';
import md from '../Markdown';
diff --git a/src/app/components/job/JobTags.tsx b/src/app/components/job/JobTags.tsx
index 08d7294..363bea7 100644
--- a/src/app/components/job/JobTags.tsx
+++ b/src/app/components/job/JobTags.tsx
@@ -1,23 +1,15 @@
-import { useAutoFocus } from "@/app/hooks/FocusedElement";
import React from "react";
import { Container } from "react-bootstrap";
+import Tag from "../Tag";
export type Props = {
- tags: string[]
-}
-
-export function JobTag(props: {text: string}) {
- const tagKey = 'tag ' + props.text;
- const elementRef = useAutoFocus(tagKey)
- return (
- {props.text}
- )
+ tags: string[],
}
export default function JobTags(props: Props) {
return (
- {props.tags.map((tag, index) => )}
+ {props.tags.map((tag, index) => )}
)
-}
\ No newline at end of file
+}