Fixed minor bugs during code cleaning

This commit is contained in:
Vladyslav Matsiiako
2023-01-17 19:03:43 -08:00
parent 7ae73d1b62
commit 18fbe82535
13 changed files with 38 additions and 33 deletions
+3 -2
View File
@@ -190,7 +190,8 @@ const Layout = ({ children }: LayoutProps) => {
userWorkspaces.length === 0 && userWorkspaces.length === 0 &&
router.asPath !== '/noprojects' && router.asPath !== '/noprojects' &&
!router.asPath.includes('home') && !router.asPath.includes('home') &&
!router.asPath.includes('settings') !router.asPath.includes('settings') ||
router.asPath === '/dashboard/undefined'
) { ) {
router.push('/noprojects'); router.push('/noprojects');
} else if (router.asPath !== '/noprojects') { } else if (router.asPath !== '/noprojects') {
@@ -259,7 +260,7 @@ const Layout = ({ children }: LayoutProps) => {
</div> </div>
{Object.keys(workspaceMapping).length > 0 ? ( {Object.keys(workspaceMapping).length > 0 ? (
<Listbox <Listbox
selected={workspaceSelected} isSelected={workspaceSelected}
onChange={setWorkspaceSelected} onChange={setWorkspaceSelected}
data={Object.keys(workspaceMapping)} data={Object.keys(workspaceMapping)}
buttonAction={openModal} buttonAction={openModal}
+12 -12
View File
@@ -4,7 +4,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Listbox, Transition } from '@headlessui/react'; import { Listbox, Transition } from '@headlessui/react';
interface ListBoxProps { interface ListBoxProps {
selected: string; isSelected: string;
onChange: (arg: string) => void; onChange: (arg: string) => void;
data: string[] | null; data: string[] | null;
text?: string; text?: string;
@@ -15,7 +15,7 @@ interface ListBoxProps {
/** /**
* This is the component that we use for drop down lists. * This is the component that we use for drop down lists.
* @param {object} obj * @param {object} obj
* @param {string} obj.selected - the item that is currently selected * @param {string} obj.isSelected - the item that is currently selected
* @param {function} obj.onChange - what happends if you select the item inside a list * @param {function} obj.onChange - what happends if you select the item inside a list
* @param {string[]} obj.data - all the options available * @param {string[]} obj.data - all the options available
* @param {string} obj.text - the text that shows us in front of the select option * @param {string} obj.text - the text that shows us in front of the select option
@@ -23,7 +23,7 @@ interface ListBoxProps {
* @returns * @returns
*/ */
const ListBox = ({ const ListBox = ({
selected, isSelected,
onChange, onChange,
data, data,
text, text,
@@ -31,7 +31,7 @@ const ListBox = ({
isFull isFull
}: ListBoxProps): JSX.Element => { }: ListBoxProps): JSX.Element => {
return ( return (
<Listbox value={selected} onChange={onChange}> <Listbox value={isSelected} onChange={onChange}>
<div className="relative"> <div className="relative">
<Listbox.Button <Listbox.Button
className={`text-gray-400 relative ${ className={`text-gray-400 relative ${
@@ -40,9 +40,9 @@ const ListBox = ({
> >
<div className="flex flex-row"> <div className="flex flex-row">
{text} {text}
<span className="ml-1 cursor-pointer block truncate font-semibold text-gray-300 capitalize"> <span className="ml-1 cursor-pointer block truncate font-semibold text-gray-300">
{' '} {' '}
{selected} {isSelected}
</span> </span>
</div> </div>
{data && ( {data && (
@@ -62,22 +62,22 @@ const ListBox = ({
{data.map((person, personIdx) => ( {data.map((person, personIdx) => (
<Listbox.Option <Listbox.Option
key={`${person}.${personIdx + 1}`} key={`${person}.${personIdx + 1}`}
className={({ active, selected: isSelected }) => className={({ active, selected }) =>
`my-0.5 relative cursor-default select-none py-2 pl-10 pr-4 rounded-md capitalize ${ `my-0.5 relative cursor-default select-none py-2 pl-10 pr-4 rounded-md ${
isSelected ? 'bg-white/10 text-gray-400 font-bold' : '' selected ? 'bg-white/10 text-gray-400 font-bold' : ''
} ${ } ${
active && !isSelected active && !selected
? 'bg-white/5 text-mineshaft-200 cursor-pointer' ? 'bg-white/5 text-mineshaft-200 cursor-pointer'
: 'text-gray-400' : 'text-gray-400'
} ` } `
} }
value={person} value={person}
> >
{({ selected: isSelected }) => ( {({ selected }) => (
<> <>
<span <span
className={`block truncate text-primary${ className={`block truncate text-primary${
isSelected ? 'font-medium' : 'font-normal' selected ? 'font-medium' : 'font-normal'
}`} }`}
> >
{person} {person}
@@ -126,7 +126,7 @@ const AddApiKeyDialog = ({
</div> </div>
<div className='max-h-28'> <div className='max-h-28'>
<ListBox <ListBox
selected={apiKeyExpiresIn} isSelected={apiKeyExpiresIn}
onChange={setApiKeyExpiresIn} onChange={setApiKeyExpiresIn}
data={[ data={[
'1 day', '1 day',
@@ -107,7 +107,7 @@ const AddProjectMemberDialog = ({
</div> </div>
<div className="max-h-28"> <div className="max-h-28">
{data?.length > 0 && ( {data?.length > 0 && (
<ListBox selected={email || data[0]} onChange={setEmail} data={data} isFull /> <ListBox isSelected={email || data[0]} onChange={setEmail} data={data} isFull />
)} )}
</div> </div>
<div className="max-w-max"> <div className="max-w-max">
@@ -170,7 +170,7 @@ const AddServiceTokenDialog = ({
</div> </div>
<div className='max-h-28 mb-2'> <div className='max-h-28 mb-2'>
<ListBox <ListBox
selected={ isSelected={
selectedServiceTokenEnv?.name selectedServiceTokenEnv?.name
? selectedServiceTokenEnv?.name ? selectedServiceTokenEnv?.name
: environments[0]?.name : environments[0]?.name
@@ -192,7 +192,7 @@ const AddServiceTokenDialog = ({
</div> </div>
<div className='max-h-28'> <div className='max-h-28'>
<ListBox <ListBox
selected={serviceTokenExpiresIn} isSelected={serviceTokenExpiresIn}
onChange={setServiceTokenExpiresIn} onChange={setServiceTokenExpiresIn}
data={[ data={[
'1 day', '1 day',
@@ -152,7 +152,7 @@ const UserTable = ({ userData, changeData, myUser, filter, resendInvite, isOrg }
((myRole === 'admin' && row.role !== 'owner') || myRole === 'owner') && ((myRole === 'admin' && row.role !== 'owner') || myRole === 'owner') &&
myUser !== row.email ? ( myUser !== row.email ? (
<Listbox <Listbox
selected={row.role} isSelected={row.role}
onChange={(e) => handleRoleUpdate(index, e)} onChange={(e) => handleRoleUpdate(index, e)}
data={ data={
myRole === 'owner' ? ['owner', 'admin', 'member'] : ['admin', 'member'] myRole === 'owner' ? ['owner', 'admin', 'member'] : ['admin', 'member']
@@ -163,7 +163,7 @@ const UserTable = ({ userData, changeData, myUser, filter, resendInvite, isOrg }
row.status !== 'invited' && row.status !== 'invited' &&
row.status !== 'verified' && ( row.status !== 'verified' && (
<Listbox <Listbox
selected={row.role} isSelected={row.role}
text="Role: " text="Role: "
onChange={() => { onChange={() => {
throw new Error('Function not implemented.'); throw new Error('Function not implemented.');
@@ -94,7 +94,7 @@ const Integration = ({ integration, environments = [] }: Props) => {
<div className="text-gray-400 text-xs font-semibold mb-2 w-60">ENVIRONMENT</div> <div className="text-gray-400 text-xs font-semibold mb-2 w-60">ENVIRONMENT</div>
<ListBox <ListBox
data={!integration.isActive ? ['Development', 'Preview', 'Production'] : null} data={!integration.isActive ? ['Development', 'Preview', 'Production'] : null}
selected={integrationTarget} isSelected={integrationTarget}
onChange={setIntegrationTarget} onChange={setIntegrationTarget}
isFull isFull
/> />
@@ -110,7 +110,7 @@ const Integration = ({ integration, environments = [] }: Props) => {
? ['Production', 'Deploy previews', 'Branch deploys', 'Local development'] ? ['Production', 'Deploy previews', 'Branch deploys', 'Local development']
: null : null
} }
selected={integrationContext} isSelected={integrationContext}
onChange={setIntegrationContext} onChange={setIntegrationContext}
/> />
</div> </div>
@@ -134,7 +134,7 @@ const Integration = ({ integration, environments = [] }: Props) => {
<p className="text-gray-400 text-xs font-semibold mb-2">ENVIRONMENT</p> <p className="text-gray-400 text-xs font-semibold mb-2">ENVIRONMENT</p>
<ListBox <ListBox
data={!integration.isActive ? environments.map(({ name }) => name) : null} data={!integration.isActive ? environments.map(({ name }) => name) : null}
selected={integrationEnvironment.name} isSelected={integrationEnvironment.name}
onChange={(envName) => onChange={(envName) =>
setIntegrationEnvironment( setIntegrationEnvironment(
environments.find(({ name }) => envName === name) || { environments.find(({ name }) => envName === name) || {
@@ -159,7 +159,7 @@ const Integration = ({ integration, environments = [] }: Props) => {
<div className="text-gray-400 text-xs font-semibold mb-2">APP</div> <div className="text-gray-400 text-xs font-semibold mb-2">APP</div>
<ListBox <ListBox
data={!integration.isActive ? apps.map((app) => app.name) : null} data={!integration.isActive ? apps.map((app) => app.name) : null}
selected={integrationApp} isSelected={integrationApp}
onChange={(app) => { onChange={(app) => {
setIntegrationApp(app); setIntegrationApp(app);
}} }}
@@ -204,7 +204,11 @@ const attemptLogin = async (
} }
if (isLogin) { if (isLogin) {
router.push(`/dashboard/${localStorage.getItem('projectData.id')}`); if (localStorage.getItem('projectData.id') !== "undefined") {
router.push(`/dashboard/${localStorage.getItem('projectData.id')}`);
} else {
router.push("/noprojects");
}
} }
} catch (error) { } catch (error) {
console.log(error); console.log(error);
+3 -3
View File
@@ -564,7 +564,7 @@ export default function Dashboard() {
</div> </div>
{!snapshotData && data?.length === 0 && ( {!snapshotData && data?.length === 0 && (
<ListBox <ListBox
selected={selectedEnv.name} isSelected={selectedEnv.name}
data={workspaceEnvs.map(({ name }) => name)} data={workspaceEnvs.map(({ name }) => name)}
onChange={(envName) => onChange={(envName) =>
setSelectedEnv( setSelectedEnv(
@@ -644,7 +644,7 @@ export default function Dashboard() {
<> <>
{!snapshotData ? ( {!snapshotData ? (
<ListBox <ListBox
selected={selectedEnv.name} isSelected={selectedEnv.name}
data={workspaceEnvs.map(({ name }) => name)} data={workspaceEnvs.map(({ name }) => name)}
onChange={(envName) => onChange={(envName) =>
setSelectedEnv( setSelectedEnv(
@@ -657,7 +657,7 @@ export default function Dashboard() {
/> />
) : ( ) : (
<ListBox <ListBox
selected={selectedSnapshotEnv?.name || ''} isSelected={selectedSnapshotEnv?.name || ''}
data={workspaceEnvs.map(({ name }) => name)} data={workspaceEnvs.map(({ name }) => name)}
onChange={(envName) => onChange={(envName) =>
setSelectedSnapshotEnv( setSelectedSnapshotEnv(
+1 -1
View File
@@ -151,7 +151,7 @@ export default function Login() {
<div className="absolute right-4 top-0 mt-4 flex items-center justify-center"> <div className="absolute right-4 top-0 mt-4 flex items-center justify-center">
<div className="w-48 mx-auto"> <div className="w-48 mx-auto">
<ListBox <ListBox
selected={lang} isSelected={lang}
onChange={setLanguage} onChange={setLanguage}
data={['en', 'ko', 'fr', 'pt-BR']} data={['en', 'ko', 'fr', 'pt-BR']}
isFull isFull
+1 -1
View File
@@ -31,7 +31,7 @@ export default function NoProjects() {
</div> </div>
<div className="px-4 rounded-md bg-bunker-500 mb-8 text-bunker-300 shadow-xl py-6"> <div className="px-4 rounded-md bg-bunker-500 mb-8 text-bunker-300 shadow-xl py-6">
<div className="max-w-md"> <div className="max-w-md">
You are not part of any projects in this organization yet. When you do, they will appear You are not part of any projects in this organization yet. When you are, they will appear
here. here.
</div> </div>
<div className="max-w-md mt-4"> <div className="max-w-md mt-4">
+2 -2
View File
@@ -72,7 +72,7 @@ export default function SettingsOrg() {
key: guidGenerator(), key: guidGenerator(),
firstName: orgUser.user?.firstName, firstName: orgUser.user?.firstName,
lastName: orgUser.user?.lastName, lastName: orgUser.user?.lastName,
email: orgUser.user?.email === null ? orgUser.inviteEmail : orgUser.user?.email, email: orgUser.user?.email == null ? orgUser.inviteEmail : orgUser.user?.email,
role: orgUser?.role, role: orgUser?.role,
status: orgUser?.status, status: orgUser?.status,
userId: orgUser.user?._id, userId: orgUser.user?._id,
@@ -115,7 +115,7 @@ export default function SettingsOrg() {
}; };
const submitAddUserModal = async (newUserEmail: string) => { const submitAddUserModal = async (newUserEmail: string) => {
await addUserToOrg(email, localStorage.getItem('orgData.id') as string); await addUserToOrg(newUserEmail, localStorage.getItem('orgData.id') as string);
setEmail(''); setEmail('');
setIsAddUserOpen(false); setIsAddUserOpen(false);
router.reload(); router.reload();
@@ -93,7 +93,7 @@ export default function PersonalSettings() {
</p> </p>
<div className="max-h-28 w-ful mt-4"> <div className="max-h-28 w-ful mt-4">
<ListBox <ListBox
selected={lang} isSelected={lang}
onChange={setLanguage} onChange={setLanguage}
data={['en', 'ko', 'fr']} data={['en', 'ko', 'fr']}
text={`${t('common:language')}: `} text={`${t('common:language')}: `}