refactor(ui): changed frontend to normal i18n without SSR

This commit is contained in:
akhilmhdh
2023-05-09 23:28:23 +05:30
parent 420d71d923
commit 3561c589b1
198 changed files with 5008 additions and 5253 deletions
@@ -1,7 +1,7 @@
import crypto from 'crypto';
import { useState } from 'react';
import { useTranslation } from 'next-i18next';
import { useTranslation } from 'react-i18next';
import { faMinus, faPlus, faShuffle } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
@@ -28,7 +28,7 @@ export const GenRandomNumber = ({ onGenerate }: Props) => {
leftIcon={<FontAwesomeIcon icon={faShuffle} />}
onClick={onGenerateRandomHex}
>
{t('dashboard:sidebar.generate-random-hex')}
{t('dashboard.sidebar.generate-random-hex')}
</Button>
<div className="rounded-r-md bg-mineshaft p-2">
<div className="flex rounded-md border-mineshaft-400 bg-bunker-800 p-1 px-2">
@@ -1,5 +1,5 @@
import { ChangeEvent, DragEvent } from 'react';
import { useTranslation } from 'next-i18next';
import { useTranslation } from 'react-i18next';
import { faUpload } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { twMerge } from 'tailwind-merge';
@@ -78,55 +78,53 @@ export const SecretDropzone = ({ isSmaller, onParsedEnv, onAddNewSecret }: Props
};
return (
<div className="mx-1">
<div
onDragEnter={handleDrag}
onDragLeave={handleDrag}
onDragOver={handleDrag}
onDrop={handleDrop}
className={twMerge(
'relative mb-4 mt-4 max-w-[calc(100vw-292px)] flex w-full cursor-pointer text-mineshaft-200 items-center py-8 justify-center space-x-2 rounded-md bg-mineshaft-900 px-2 opacity-60 outline-dashed outline-2 outline-chicago-600 duration-200 hover:opacity-100',
isDragActive && 'opacity-100',
!isSmaller && 'flex-col space-y-4 max-w-3xl py-20',
isLoading && 'bg-bunker-800'
)}
>
{isLoading ? (
<div className="mb-16 flex items-center justify-center pt-16">
<img src="/images/loading/loading.gif" height={70} width={120} alt="loading animation" />
<div
onDragEnter={handleDrag}
onDragLeave={handleDrag}
onDragOver={handleDrag}
onDrop={handleDrop}
className={twMerge(
'relative mx-0.5 mb-4 mt-4 flex w-full max-w-[calc(100vw-292px)] cursor-pointer items-center justify-center space-x-2 rounded-md bg-mineshaft-900 py-8 px-2 text-mineshaft-200 opacity-60 outline-dashed outline-2 outline-chicago-600 duration-200 hover:opacity-100',
isDragActive && 'opacity-100',
!isSmaller && 'max-w-3xl flex-col space-y-4 py-20',
isLoading && 'bg-bunker-800'
)}
>
{isLoading ? (
<div className="mb-16 flex items-center justify-center pt-16">
<img src="/images/loading/loading.gif" height={70} width={120} alt="loading animation" />
</div>
) : (
<>
<div>
<FontAwesomeIcon icon={faUpload} size={isSmaller ? '2x' : '5x'} />
</div>
) : (
<>
<div>
<FontAwesomeIcon icon={faUpload} size={isSmaller ? '2x' : '5x'} />
</div>
<div>
<p className="">{t(isSmaller ? 'common:drop-zone-keys' : 'common:drop-zone')}</p>
</div>
<input
id="fileSelect"
type="file"
className="absolute h-full w-full cursor-pointer opacity-0"
accept=".txt,.env,.yml,.yaml"
onChange={handleFileUpload}
/>
{!isSmaller && (
<>
<div className="flex w-full flex-row items-center justify-center py-4">
<div className="w-1/5 border-t border-mineshaft-700" />
<p className="mx-4 text-xs text-mineshaft-400">OR</p>
<div className="w-1/5 border-t border-mineshaft-700" />
</div>
<div>
<Button variant="star" onClick={onAddNewSecret}>
Add a new secret
</Button>
</div>
</>
)}{' '}
</>
)}
</div>
<div>
<p className="">{t(isSmaller ? 'common.drop-zone-keys' : 'common.drop-zone')}</p>
</div>
<input
id="fileSelect"
type="file"
className="absolute h-full w-full cursor-pointer opacity-0"
accept=".txt,.env,.yml,.yaml"
onChange={handleFileUpload}
/>
{!isSmaller && (
<>
<div className="flex w-full flex-row items-center justify-center py-4">
<div className="w-1/5 border-t border-mineshaft-700" />
<p className="mx-4 text-xs text-mineshaft-400">OR</p>
<div className="w-1/5 border-t border-mineshaft-700" />
</div>
<div>
<Button variant="star" onClick={onAddNewSecret}>
Add a new secret
</Button>
</div>
</>
)}{' '}
</>
)}
</div>
);
};