diff --git a/package.json b/package.json index 9fa15bd4..62807bba 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ui", - "version": "0.33.7", + "version": "0.33.8", "private": true, "scripts": { "dev": "GENERATE_SOURCEMAP=false react-scripts start", diff --git a/src/components/Breadcrumb/Breadcrumb.tsx b/src/components/Breadcrumb/Breadcrumb.tsx index f70fe576..d75d9b2c 100644 --- a/src/components/Breadcrumb/Breadcrumb.tsx +++ b/src/components/Breadcrumb/Breadcrumb.tsx @@ -1,5 +1,5 @@ import React, { ReactElement } from "react"; -import { stringSlugify } from "../../functions/GeneralFunctions"; +import { stringSlugify } from "../../functions/general.function"; import { Link, useParams } from "react-router-dom"; import useBreadcrumbs from "use-react-router-breadcrumbs"; import { diff --git a/src/components/CFRosDistros/CFRosDistros.tsx b/src/components/CFRosDistros/CFRosDistros.tsx index 6b8a7a4b..eb64d95e 100644 --- a/src/components/CFRosDistros/CFRosDistros.tsx +++ b/src/components/CFRosDistros/CFRosDistros.tsx @@ -1,4 +1,4 @@ -import { stringSlugify } from "../../functions/GeneralFunctions"; +import { stringSlugify } from "../../functions/general.function"; import InputError from "../InputError/InputError"; import { MdVerified } from "react-icons/md"; import InfoTip from "../InfoTip/InfoTip"; diff --git a/src/components/CFWorkspaceDistro/CFWorkspaceDistro.tsx b/src/components/CFWorkspaceDistro/CFWorkspaceDistro.tsx index bef7f4d7..fd11abd5 100644 --- a/src/components/CFWorkspaceDistro/CFWorkspaceDistro.tsx +++ b/src/components/CFWorkspaceDistro/CFWorkspaceDistro.tsx @@ -1,7 +1,7 @@ import { Fragment, ReactElement } from "react"; import FormInputSelect from "../FormInputSelect/FormInputSelect"; import { FormikProps } from "formik/dist/types"; -import { stringCapitalization } from "../../functions/GeneralFunctions"; +import { stringCapitalization } from "../../functions/general.function"; import { IEnvironmentStep2 } from "../../interfaces/environment/environment.step2.interface"; import useMain from "../../hooks/useMain"; diff --git a/src/components/CreateForms/CFStep4.tsx b/src/components/CreateForms/CFStep4.tsx index 9da09fb4..664cb11b 100644 --- a/src/components/CreateForms/CFStep4.tsx +++ b/src/components/CreateForms/CFStep4.tsx @@ -1,5 +1,4 @@ import RobotDeleteLaunchManagerButton from "../RobotDeleteLaunchManagerButton/RobotDeleteLaunchManagerButton"; -import { organizationNameViewer } from "../../functions/GeneralFunctions"; import CFLaunchWorkspace from "../CFLaunchWorkspace/CFLaunchWorkspace"; import { Fragment, ReactElement, useEffect, useState } from "react"; import { createLaunchManager } from "../../toolkit/RobotSlice"; @@ -16,6 +15,7 @@ import { useFormik } from "formik"; import { toast } from "sonner"; import * as Yup from "yup"; import { IEnvironmentStep4LaunchStep } from "../../interfaces/environment/environment.step4.interface"; +import { orgSplitter } from "../../functions/general.function"; interface ICFStep4 { isImportRobot?: boolean; @@ -80,10 +80,9 @@ export default function CFStep4({ ); setTimeout(() => { - window.location.href = `/${organizationNameViewer({ - organizationName: selectedState?.organization?.name!, - capitalization: false, - })}/${selectedState?.roboticsCloud?.name}/${ + window.location.href = `/${orgSplitter( + selectedState?.organization?.name!, + )}/${selectedState?.roboticsCloud?.name}/${ selectedState?.instance?.name }/${selectedState?.fleet?.name}/${robotData?.step1?.details.name}`; }, 1000); diff --git a/src/components/FilteredTags/FilteredTags.tsx b/src/components/FilteredTags/FilteredTags.tsx index bcea7230..e0a7d809 100644 --- a/src/components/FilteredTags/FilteredTags.tsx +++ b/src/components/FilteredTags/FilteredTags.tsx @@ -1,4 +1,4 @@ -import { organizationNameViewer } from "../../functions/GeneralFunctions"; +import { orgSplitter } from "../../functions/general.function"; import useMain from "../../hooks/useMain"; import { ReactElement } from "react"; @@ -16,10 +16,7 @@ export default function FilteredTags(): ReactElement { alt="robolaunch" /> - {organizationNameViewer({ - organizationName: selectedState?.organization?.name, - capitalization: false, - })} + {orgSplitter(selectedState?.organization?.name)} )} diff --git a/src/components/HeaderDropdownMenu/HeaderDropdownMenu.tsx b/src/components/HeaderDropdownMenu/HeaderDropdownMenu.tsx index e73f91b2..8f75f7b3 100644 --- a/src/components/HeaderDropdownMenu/HeaderDropdownMenu.tsx +++ b/src/components/HeaderDropdownMenu/HeaderDropdownMenu.tsx @@ -1,4 +1,4 @@ -import { handleLogout } from "../../functions/GeneralFunctions"; +import { handleLogout } from "../../functions/general.function"; import useOnclickOutside from "react-cool-onclickoutside"; import { Fragment, ReactElement, useState } from "react"; import { useKeycloak } from "@react-keycloak/web"; diff --git a/src/components/MarketplaceRobotAssetItem/MarketplaceRobotAssetItem.tsx b/src/components/MarketplaceRobotAssetItem/MarketplaceRobotAssetItem.tsx index 14c61a83..92febd24 100644 --- a/src/components/MarketplaceRobotAssetItem/MarketplaceRobotAssetItem.tsx +++ b/src/components/MarketplaceRobotAssetItem/MarketplaceRobotAssetItem.tsx @@ -4,7 +4,7 @@ import { BsShieldLockFill } from "react-icons/bs"; import { MdPublic } from "react-icons/md"; import { RiOrganizationChart } from "react-icons/ri"; import { Link } from "react-router-dom"; -import { stringSlugify } from "../../functions/GeneralFunctions"; +import { stringSlugify } from "../../functions/general.function"; interface IMarketplaceRobotAssetItem { robot: any; @@ -38,7 +38,7 @@ export default function MarketplaceRobotAssetItem({ {robot?.type} -
+
{(() => { switch (robot?.access) { case "public": @@ -73,14 +73,14 @@ export default function MarketplaceRobotAssetItem({
-
} - url={`/${organizationNameViewer({ - organizationName: selectedState?.organization?.name!, - capitalization: false, - })}/${ + url={`/${orgSplitter(selectedState?.organization?.name!)}/${ selectedState?.roboticsCloud?.name }/${instance?.name}/physical-instances`} data={instance} diff --git a/src/components/SidebarLists/RegionsList.tsx b/src/components/SidebarLists/RegionsList.tsx index e838c6ff..ebde1f89 100644 --- a/src/components/SidebarLists/RegionsList.tsx +++ b/src/components/SidebarLists/RegionsList.tsx @@ -1,5 +1,4 @@ -import React, { Fragment, ReactElement, useEffect, useState } from "react"; -import { organizationNameViewer } from "../../functions/GeneralFunctions"; +import { Fragment, ReactElement, useEffect, useState } from "react"; import SidebarListLoader from "../SidebarListLoader/SidebarListLoader"; import SidebarSelectInfo from "../SidebarInfo/SidebarInfo"; import StateCell from "../TableInformationCells/StateCell"; @@ -8,6 +7,7 @@ import useFunctions from "../../hooks/useFunctions"; import SidebarListItem from "./SidebarListItem"; import useMain from "../../hooks/useMain"; import { IRegion } from "../../interfaces/global/region.interface"; +import { orgSplitter } from "../../functions/general.function"; interface IRegionsList { reload: boolean; @@ -53,10 +53,9 @@ export default function RegionsList({ reload }: IRegionsList): ReactElement { } - url={`/${organizationNameViewer({ - organizationName: selectedState?.organization?.name!, - capitalization: false, - })}/${roboticsCloud?.name}`} + url={`/${orgSplitter( + selectedState?.organization?.name!, + )}/${roboticsCloud?.name}`} data={roboticsCloud} selected={ roboticsCloud?.name === selectedState?.roboticsCloud?.name diff --git a/src/components/SidebarLists/SidebarListItem.tsx b/src/components/SidebarLists/SidebarListItem.tsx index 1782c8af..1d19fe1f 100644 --- a/src/components/SidebarLists/SidebarListItem.tsx +++ b/src/components/SidebarLists/SidebarListItem.tsx @@ -1,4 +1,3 @@ -import { organizationNameViewer } from "../../functions/GeneralFunctions"; import { MdKeyboardArrowRight } from "react-icons/md"; import { useNavigate } from "react-router-dom"; import useMain from "../../hooks/useMain"; @@ -9,6 +8,7 @@ import { IRegion } from "../../interfaces/global/region.interface"; import { ICloudInstance } from "../../interfaces/global/cloudInstance.interface"; import { IFleet } from "../../interfaces/global/fleet.interface"; import { INamespace } from "../../interfaces/global/namespace.interface"; +import { orgSplitter } from "../../functions/general.function"; interface ISidebarListItem { name: string | ReactElement; @@ -123,10 +123,9 @@ export default function SidebarListItem({ case "robot": setSidebarState({ ...sidebarState, isOpen: false }); navigate( - `/${organizationNameViewer({ - organizationName: selectedState?.organization?.name as string, - capitalization: false, - })}/${selectedState?.roboticsCloud?.name}/${ + `/${orgSplitter( + selectedState?.organization?.name as string, + )}/${selectedState?.roboticsCloud?.name}/${ selectedState?.instance?.name }/${selectedState?.fleet?.name}/${url}`, ); diff --git a/src/controllers/InstanceTableData.tsx b/src/controllers/InstanceTableData.tsx index 1e55fc8a..ee4355d2 100644 --- a/src/controllers/InstanceTableData.tsx +++ b/src/controllers/InstanceTableData.tsx @@ -2,7 +2,6 @@ import { getRegionFromProviderCode } from "../functions/instance.function"; import NSActionCells from "../components/TableActionCells/NSActionCells"; import BasicCell from "../components/TableInformationCells/BasicCell"; import StateCell from "../components/TableInformationCells/StateCell"; -import { orgSplitter } from "../functions/string.splitter.function"; import InfoCell from "../components/TableInformationCells/InfoCell"; import { INamespace } from "../interfaces/global/namespace.interface"; import { IFleet } from "../interfaces/global/fleet.interface"; @@ -11,6 +10,7 @@ import useFunctions from "../hooks/useFunctions"; import { useAppSelector } from "../hooks/redux"; import { useParams } from "react-router-dom"; import useMain from "../hooks/useMain"; +import { orgSplitter } from "../functions/general.function"; export function InstanceTableData() { const [fleets, setFleets] = useState(); diff --git a/src/controllers/MainTableData.tsx b/src/controllers/MainTableData.tsx index 474d70f2..d1fc86bc 100644 --- a/src/controllers/MainTableData.tsx +++ b/src/controllers/MainTableData.tsx @@ -2,10 +2,10 @@ import TemporaryActionCells from "../components/TableActionCells/TemporaryAction import StateCell from "../components/TableInformationCells/StateCell"; import { IOrganization } from "../interfaces/global/organization.interface"; import InfoCell from "../components/TableInformationCells/InfoCell"; -import { orgSplitter } from "../functions/string.splitter.function"; import { useEffect, useMemo, useState } from "react"; import useFunctions from "../hooks/useFunctions"; import { useParams } from "react-router-dom"; +import { orgSplitter } from "../functions/general.function"; export function MainTableData() { const [orgs, setOrgs] = useState(); diff --git a/src/controllers/NamespaceTableData.tsx b/src/controllers/NamespaceTableData.tsx index 7d059768..6d0289dc 100644 --- a/src/controllers/NamespaceTableData.tsx +++ b/src/controllers/NamespaceTableData.tsx @@ -2,15 +2,14 @@ import EnvironmentActionCells from "../components/TableActionCells/EnvironmentAc import { IEnvironmentStep1 } from "../interfaces/environment/environment.step1.interface"; import { IEnvironmentStep2 } from "../interfaces/environment/environment.step2.interface"; import { IEnvironment } from "../interfaces/environment/environment.interface"; -import { handleSplitOrganizationName } from "../functions/GeneralFunctions"; import StateCell from "../components/TableInformationCells/StateCell"; import BasicCell from "../components/TableInformationCells/BasicCell"; -import { orgSplitter } from "../functions/string.splitter.function"; import InfoCell from "../components/TableInformationCells/InfoCell"; import { useEffect, useMemo, useState } from "react"; import useFunctions from "../hooks/useFunctions"; import { useParams } from "react-router-dom"; import useMain from "../hooks/useMain"; +import { orgSplitter } from "../functions/general.function"; export function NamespaceTableData() { const [environments, setEnviroments] = useState< @@ -103,9 +102,7 @@ export function NamespaceTableData() { environments?.map((env) => { return { name: env?.step1?.details?.name, - organization: handleSplitOrganizationName( - pagesState?.organization?.name!, - ), + organization: orgSplitter(pagesState?.organization?.name!), region: pagesState?.roboticsCloud?.name!, instance: pagesState?.instance?.name!, fleet: pagesState?.fleet?.name!, diff --git a/src/controllers/OrgTableData.tsx b/src/controllers/OrgTableData.tsx index 1296fe26..ae6178c7 100644 --- a/src/controllers/OrgTableData.tsx +++ b/src/controllers/OrgTableData.tsx @@ -3,12 +3,12 @@ import { getRegionFromProviderCode } from "../functions/instance.function"; import StateCell from "../components/TableInformationCells/StateCell"; import BasicCell from "../components/TableInformationCells/BasicCell"; import InfoCell from "../components/TableInformationCells/InfoCell"; -import { orgSplitter } from "../functions/string.splitter.function"; import { IRegion } from "../interfaces/global/region.interface"; import { useEffect, useMemo, useState } from "react"; import useFunctions from "../hooks/useFunctions"; import { useParams } from "react-router-dom"; import useMain from "../hooks/useMain"; +import { orgSplitter } from "../functions/general.function"; export function OrgTableData() { const [regions, setRegions] = useState(null); diff --git a/src/controllers/RegionTableData.tsx b/src/controllers/RegionTableData.tsx index 2eff3fec..0fd257e8 100644 --- a/src/controllers/RegionTableData.tsx +++ b/src/controllers/RegionTableData.tsx @@ -5,11 +5,11 @@ import { ICloudInstance } from "../interfaces/global/cloudInstance.interface"; import BasicCell from "../components/TableInformationCells/BasicCell"; import StateCell from "../components/TableInformationCells/StateCell"; import InfoCell from "../components/TableInformationCells/InfoCell"; -import { orgSplitter } from "../functions/string.splitter.function"; import { Fragment, useEffect, useMemo, useState } from "react"; import useFunctions from "../hooks/useFunctions"; import { useParams } from "react-router-dom"; import useMain from "../hooks/useMain"; +import { orgSplitter } from "../functions/general.function"; export function RegionTableData() { const [instances, setInstances] = useState(null); diff --git a/src/functions/GeneralFunctions.ts b/src/functions/GeneralFunctions.ts deleted file mode 100644 index 003ed25d..00000000 --- a/src/functions/GeneralFunctions.ts +++ /dev/null @@ -1,97 +0,0 @@ -export function stringSlugify(text: string): string { - if (text) { - return text - .toLowerCase() - .replace(/[^a-zA-Z0-9]+/g, "-") - .replace(/^-+/, "") - .replace(/-+$/, ""); - } - - return text; -} - -export function stringCapitalization({ str }: { str: string }) { - var splitStr = str?.toLowerCase().split(" "); - for (var i = 0; i < splitStr?.length; i++) { - splitStr[i] = - splitStr[i].charAt(0).toUpperCase() + splitStr[i].substring(1); - } - return splitStr?.join(" "); -} - -export function handleGetRandomNumbers(length: number): number { - const min = 10 ** (length - 1); - const max = 10 ** length - 1; - return Math.floor(Math.random() * (max - min + 1)) + min; -} - -export function handleGetRandomString(length: number): string { - return [...Array(length)] - .map(() => String.fromCharCode(97 + Math.floor(Math.random() * 26))) - .join(""); -} - -export function organizationNameViewer({ - organizationName, - capitalization = true, -}: { - organizationName: string; - capitalization?: boolean; -}) { - if (capitalization) { - return stringCapitalization({ - str: organizationName?.split("_")[1], - }); - } - - return organizationName?.split("_")[1]; -} - -export function handleSplitOrganizationName(organizationName: string) { - return organizationName?.split("_")[1]; -} - -export function orgNameViewer( - orgname: string, - capitalization: boolean = false, -) { - if (capitalization) { - return stringCapitalization({ - str: orgname?.split("_")[1], - }); - } - - return orgname?.split("_")[1]; -} - -export function handleLogout() { - [ - "tokens", - "githubTokens", - "persist:user", - "persist:organization", - "persist:roboticsCloud", - "persist:fleet", - "persist:robot", - "persist:github", - "persist:region", - "persist:provider", - "persist:trial", - "persist:marketplace", - "persist:instance", - ].map((item: string) => localStorage.removeItem(item)); -} - -export function handleTimeConverter(totalSeconds: number) { - const totalMinutes = Math.floor(totalSeconds / 60); - - const seconds = totalSeconds % 60; - const hours = Math.floor(totalMinutes / 60); - const minutes = totalMinutes % 60; - - return { h: hours, m: minutes, s: seconds }; -} - -export function handleRandomInteger(min: number, max: number) { - return Math.floor(Math.random() * (max - min + 1)) + min; -} diff --git a/src/functions/general.function.ts b/src/functions/general.function.ts new file mode 100644 index 00000000..d821e0f2 --- /dev/null +++ b/src/functions/general.function.ts @@ -0,0 +1,42 @@ +export function orgSplitter(orgName: string): string { + return orgName?.split("_")[1]; +} + +export function stringSlugify(text: string): string { + if (text) { + return text + .toLowerCase() + .replace(/[^a-zA-Z0-9]+/g, "-") + .replace(/^-+/, "") + .replace(/-+$/, ""); + } + + return text; +} + +export function stringCapitalization({ str }: { str: string }) { + var splitStr = str?.toLowerCase().split(" "); + for (var i = 0; i < splitStr?.length; i++) { + splitStr[i] = + splitStr[i].charAt(0).toUpperCase() + splitStr[i].substring(1); + } + return splitStr?.join(" "); +} + +export function handleLogout() { + [ + "tokens", + "githubTokens", + "persist:user", + "persist:organization", + "persist:roboticsCloud", + "persist:fleet", + "persist:robot", + "persist:github", + "persist:region", + "persist:provider", + "persist:trial", + "persist:marketplace", + "persist:instance", + ].map((item: string) => localStorage.removeItem(item)); +} diff --git a/src/functions/string.splitter.function.ts b/src/functions/string.splitter.function.ts deleted file mode 100644 index f49e75e1..00000000 --- a/src/functions/string.splitter.function.ts +++ /dev/null @@ -1,3 +0,0 @@ -export function orgSplitter(orgName: string): string { - return orgName?.split("_")[1]; -} diff --git a/src/layouts/SidebarContentLayout.tsx b/src/layouts/SidebarContentLayout.tsx index 5179b393..45fa058a 100644 --- a/src/layouts/SidebarContentLayout.tsx +++ b/src/layouts/SidebarContentLayout.tsx @@ -16,7 +16,7 @@ import OrganizationsList from "../components/SidebarLists/OrganizationsList"; import AppsList from "../components/SidebarLists/AppsList"; import NamespacesList from "../components/SidebarLists/NamespacesList"; import CFOrganization from "../components/CreateForms/CFOrganization"; -import { stringCapitalization } from "../functions/GeneralFunctions"; +import { stringCapitalization } from "../functions/general.function"; import FilteredTags from "../components/FilteredTags/FilteredTags"; import RobotsList from "../components/SidebarLists/RobotsList"; import FleetsList from "../components/SidebarLists/FleetsList"; diff --git a/src/layouts/UserRoleManagementLayout.tsx b/src/layouts/UserRoleManagementLayout.tsx index b41d2ff6..f107e488 100644 --- a/src/layouts/UserRoleManagementLayout.tsx +++ b/src/layouts/UserRoleManagementLayout.tsx @@ -3,13 +3,13 @@ import CardLayout from "./CardLayout"; import InformationWidget from "../components/InformationWidget/InformationWidget"; import OrganizationsTable from "../pages/UserRoleManagement/OrganizationsPage"; import OrganizationUsersPage from "../pages/UserRoleManagement/OrganizationUsersPage"; -import { organizationNameViewer } from "../functions/GeneralFunctions"; import OrganizationGuestsPage from "../pages/UserRoleManagement/OrganizationGuestsPage"; import OrganizationAdminsPage from "../pages/UserRoleManagement/OrganizationAdminsPage"; import Button from "../components/Button/Button"; import InviteUserToOrganizationModal from "../modals/IntiveUserToOrganizationModal"; import { useAppDispatch } from "../hooks/redux"; import { getOrganizations } from "../toolkit/OrganizationSlice"; +import { orgSplitter } from "../functions/general.function"; export default function UserRoleManagementLayout(): ReactElement { const [responseOrganizations, setResponseOrganizations] = useState< @@ -69,14 +69,12 @@ export default function UserRoleManagementLayout(): ReactElement { activePage?.page === "organizations" ? "Organizations" : activePage?.page === "organizationUsers" - ? `${organizationNameViewer({ - organizationName: + ? `${orgSplitter( activePage?.selectedOrganization?.organizationName, - })} Users` - : `${organizationNameViewer({ - organizationName: + )} Users` + : `${orgSplitter( activePage?.selectedOrganization?.organizationName, - })} Guests` + )} Guests` } subtitle="From this page, you can view, control or get information about all the details of the teams in your organization. If you need to create a new team or check the users in the team you @@ -88,9 +86,9 @@ export default function UserRoleManagementLayout(): ReactElement { onClick={() => setVisibleInviteUserModal(!visibleInviteUserModal) } - className="!bg-light-50 border-primary-700 !text-primary-700 hover:!bg-primary-100 !h-10 border transition-all duration-500 hover:scale-95" + className="!h-10 border border-primary-700 !bg-light-50 !text-primary-700 transition-all duration-500 hover:scale-95 hover:!bg-primary-100" /> - +
    {pages?.map((page: any) => { @@ -101,7 +99,7 @@ export default function UserRoleManagementLayout(): ReactElement { return (
  • {page?.key !== "organizations" && ( - + )} {page?.key === "organizations" ? "All Organizations" diff --git a/src/pages/DashboardsPage/OrgDashboard/OrgDashboard.tsx b/src/pages/DashboardsPage/OrgDashboard/OrgDashboard.tsx index 30cf0d28..d4343ae6 100644 --- a/src/pages/DashboardsPage/OrgDashboard/OrgDashboard.tsx +++ b/src/pages/DashboardsPage/OrgDashboard/OrgDashboard.tsx @@ -1,6 +1,6 @@ import InformationWidget from "../../../components/InformationWidget/InformationWidget"; import RegionsWidget from "../../../components/RegionsWidget/RegionsWidget"; -import { stringCapitalization } from "../../../functions/GeneralFunctions"; +import { stringCapitalization } from "../../../functions/general.function"; import CountWidget from "../../../components/CountWidget/CountWidget"; import GeneralTable from "../../../components/Table/GeneralTable"; import { ReactElement } from "react"; diff --git a/src/pages/UserRoleManagement/OrganizationsPage.tsx b/src/pages/UserRoleManagement/OrganizationsPage.tsx index 6dd37965..c60eec93 100644 --- a/src/pages/UserRoleManagement/OrganizationsPage.tsx +++ b/src/pages/UserRoleManagement/OrganizationsPage.tsx @@ -1,9 +1,9 @@ import { useMemo } from "react"; import OrgActionCells from "../../components/TableActionCells/OrgActionCells"; -import { organizationNameViewer } from "../../functions/GeneralFunctions"; import BasicCell from "../../components/TableInformationCells/BasicCell"; import InfoCell from "../../components/TableInformationCells/InfoCell"; import GeneralTable from "../../components/Table/GeneralTable"; +import { orgSplitter } from "../../functions/general.function"; interface IOrganizationsPage { responseOrganizations: any; @@ -37,9 +37,7 @@ export default function OrganizationsPage({ body: (rowData: any) => { return (