diff --git a/i18n/en.json b/i18n/en.json
index 3fac79742..9b081605a 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -23,6 +23,7 @@
"Press key to create the team": "Press to create the team.",
"Team with title already exists": "Team with title already exists. Please, try to use another title.",
"Team with key already exists": "Team with key already exists. Please, try to use another key.",
+ "Key must be 3 or longer characters": "Key must be 3 or longer characters",
"Perfect! Issues in your team will look like": "Perfect! Issues in your team will look like: #-42, #-911.",
"Flow": "Flow",
"Flow or state title": "Flow or state title"
@@ -73,6 +74,7 @@
"Press key to create the project": "Press to create the project.",
"Project with key already exists": "Project with key already exists. Please, try to use another key.",
"Perfect! Issues in your project will look like": "Perfect! Issues in your project will look like: #-42, #-911.",
+ "Key must be 3 or longer characters": "Key must be 3 or longer characters",
"Assign": "Assign",
"Enter name or email": "Enter name or email",
"Flow": "Flow",
diff --git a/i18n/ru.json b/i18n/ru.json
index 5c38827c0..a967544d4 100644
--- a/i18n/ru.json
+++ b/i18n/ru.json
@@ -23,6 +23,7 @@
"Press key to create the team": "Нажми чтобы создать команду.",
"Project with title already exists": "Команда с названием уже существует. Попробуй другое.",
"Team with key already exists": "Команда с ключом уже существует. Попробуй другой.",
+ "Key must be 3 or longer characters": "Ключ не может быть короче 3 символов",
"Perfect! Issues in your team will look like": "Супер! Задачи в твоей команде будут выглядеть примерно так: #-42, #-911.",
"Flow": "Флоу",
"Flow or state title": "Модель или статус"
@@ -72,6 +73,7 @@
"Press key to create the project": "Нажми чтобы создать проект.",
"Project with key already exists": "Проект с ключом уже существует. Попробуйте любой другой.",
"Perfect! Issues in your project will look like": "Супер! Задачи в вашем проекте будут выглядеть примерно так: #-42, #-911.",
+ "Key must be 3 or longer characters": "Ключ не может быть короче 3 символов",
"Assign": "Ответственный",
"Enter name or email": "Имя или почта",
"Flow": "Флоу",
diff --git a/src/components/ProjectCreateForm.tsx b/src/components/ProjectCreateForm.tsx
index 7a7e9f0bb..c6610b924 100644
--- a/src/components/ProjectCreateForm.tsx
+++ b/src/components/ProjectCreateForm.tsx
@@ -88,6 +88,7 @@ const ProjectCreateForm: React.FC = () => {
const [focusedInput, setFocusedInput] = useState(false);
const [hoveredInput, setHoveredInput] = useState(false);
const [busy, setBusy] = useState(false);
+ const [dirtyKey, setDirtyKey] = useState(false);
const schema = createProjectSchemaProvider(t);
type ProjectFormType = z.infer;
@@ -117,14 +118,18 @@ const ProjectCreateForm: React.FC = () => {
useDebouncedEffect(
() => {
- setValue('key', titleWatcher && titleWatcher !== '' ? keyPredictor(titleWatcher) : '');
+ if (!dirtyKey && titleWatcher && titleWatcher !== '') {
+ setValue('key', keyPredictor(titleWatcher));
+ }
},
300,
[setValue, titleWatcher],
);
+ const isKeyEnoughLength = Boolean(keyWatcher?.length >= 3);
const { data: flowData } = useSWR('flow', () => flowFetcher(user));
- const { data: projectData } = useSWR(keyWatcher && keyWatcher !== '' ? [user, keyWatcher] : null, projectFetcher);
+ const { data: projectData } = useSWR(isKeyEnoughLength ? [user, keyWatcher] : null, projectFetcher);
+ const isKeyUnique = Boolean(projectData?.project === null || !projectData);
useEffect(() => {
if (flowData?.flowRecommended) {
@@ -145,7 +150,10 @@ const ProjectCreateForm: React.FC = () => {
[router, createProject, t],
);
- const isProjectKeyAvailable = Boolean(projectData?.project === null || !projectData);
+ const onKeyDirty = useCallback(() => {
+ setDirtyKey(true);
+ }, []);
+
const richProps = {
b: (c: React.ReactNode) => (
@@ -155,6 +163,13 @@ const ProjectCreateForm: React.FC = () => {
key: () => keyWatcher,
};
+ // eslint-disable-next-line no-nested-ternary
+ const tooltip = isKeyEnoughLength
+ ? isKeyUnique
+ ? t.rich('create.Perfect! Issues in your project will look like', richProps)
+ : t.rich('create.Project with key already exists', richProps)
+ : t('create.Key must be 3 or longer characters');
+
return (
<>
@@ -162,7 +177,7 @@ const ProjectCreateForm: React.FC = () => {
-