diff --git a/packages/online-editor/src/editor/EditorPage.tsx b/packages/online-editor/src/editor/EditorPage.tsx index 05745d8bafd..e3dff3ba891 100644 --- a/packages/online-editor/src/editor/EditorPage.tsx +++ b/packages/online-editor/src/editor/EditorPage.tsx @@ -113,6 +113,10 @@ export function EditorPage(props: Props) { return; } + //If my queryparam is in the URL when the add new file in the new file dropdown is clicked on + //Then - the workspaceFilePromise will have the correct data and move on to the new file. + //Else - the workspaceFilePromise will have the 'current' data and stay on the current page and add the queryparams. + history.replace({ pathname: routes.workspaceWithFilePath.path({ workspaceId: workspaceFilePromise.data.workspaceFile.workspaceId, diff --git a/packages/online-editor/src/editor/Toolbar/EditorToolbar.tsx b/packages/online-editor/src/editor/Toolbar/EditorToolbar.tsx index bb24bd0a2f7..87f36f5935b 100644 --- a/packages/online-editor/src/editor/Toolbar/EditorToolbar.tsx +++ b/packages/online-editor/src/editor/Toolbar/EditorToolbar.tsx @@ -74,6 +74,8 @@ import { SyncDropdownMenu } from "./SyncDropdownMenu"; import { AcceleratorsDropdown } from "./Accelerators/AcceleratorsDropdown"; import { listDeletedFiles } from "../../workspace/components/WorkspaceStatusIndicator"; import { PromiseState } from "@kie-tools-core/react-hooks/dist/PromiseState"; +import { useQueryParams } from "../../queryParams/QueryParamsContext"; +import { QueryParams } from "../../navigation/Routes"; export interface Props { editor: EmbeddedEditorRef | undefined; @@ -113,6 +115,7 @@ export function EditorToolbarWithWorkspace( const workspaces = useWorkspaces(); const { i18n } = useOnlineI18n(); const copyContentTextArea = useRef(null); + const queryParams = useQueryParams(); const { alerts } = useGitIntegration(); @@ -339,6 +342,7 @@ export function EditorToolbarWithWorkspace( fileRelativePath: file.relativePathWithoutExtension, extension: file.extension, }), + search: queryParams.with(QueryParams.NEW_FILE, "new").toString(), }); }} /> diff --git a/packages/online-editor/src/editor/Toolbar/FileSwitcher.tsx b/packages/online-editor/src/editor/Toolbar/FileSwitcher.tsx index eee495cb4b3..080abf86834 100644 --- a/packages/online-editor/src/editor/Toolbar/FileSwitcher.tsx +++ b/packages/online-editor/src/editor/Toolbar/FileSwitcher.tsx @@ -83,6 +83,9 @@ import { Checkbox } from "@patternfly/react-core/dist/js/components/Checkbox"; import { SearchInput } from "@patternfly/react-core/dist/js/components/SearchInput"; import { switchExpression } from "../../switchExpression/switchExpression"; import { GitStatusProps } from "../../workspace/components/GitStatusIndicatorActions"; +import { useQueryParam, useQueryParams } from "../../queryParams/QueryParamsContext"; +import { QueryParams } from "../../navigation/Routes"; +import { useHistory } from "react-router"; const ROOT_MENU_ID = "rootMenu"; @@ -110,6 +113,9 @@ export function FileSwitcher(props: { const workspaces = useWorkspaces(); const workspaceFileNameRef = useRef(null); const [newFileNameValid, setNewFileNameValid] = useState(true); + const queryParamNewFile = useQueryParam(QueryParams.NEW_FILE); + const queryParams = useQueryParams(); + const history = useHistory(); const resetWorkspaceFileName = useCallback(() => { if (workspaceFileNameRef.current) { @@ -125,6 +131,9 @@ export function FileSwitcher(props: { setNewFileNameValid(true); return; } + history.replace({ + search: queryParams.without(QueryParams.NEW_FILE).toString(), + }); const newRelativePath = join( props.workspaceFile.relativeDirPath, @@ -140,7 +149,7 @@ export function FileSwitcher(props: { setNewFileNameValid(!hasConflictingFileName && !hasForbiddenCharacters); }, - [props.workspaceFile, workspaces] + [history, props.workspaceFile, queryParams, workspaces] ); const renameWorkspaceFile = useCallback( @@ -178,7 +187,9 @@ export function FileSwitcher(props: { }, [newFileNameValid, resetWorkspaceFileName] ); - + if (workspaceFileNameRef.current && queryParamNewFile) { + workspaceFileNameRef.current.select(); + } useEffect(resetWorkspaceFileName, [resetWorkspaceFileName]); const [isFilesDropdownOpen, setFilesDropdownOpen] = useState(false); const [isPopoverVisible, setPopoverVisible] = useState(false); diff --git a/packages/online-editor/src/importFromUrl/NewWorkspaceWithEmptyFilePage.tsx b/packages/online-editor/src/importFromUrl/NewWorkspaceWithEmptyFilePage.tsx index 5eb95555cdc..f91d08a24f4 100644 --- a/packages/online-editor/src/importFromUrl/NewWorkspaceWithEmptyFilePage.tsx +++ b/packages/online-editor/src/importFromUrl/NewWorkspaceWithEmptyFilePage.tsx @@ -25,11 +25,14 @@ import { Text, TextContent, TextVariants } from "@patternfly/react-core/dist/js/ import { Bullseye } from "@patternfly/react-core/dist/js/layouts/Bullseye"; import { Spinner } from "@patternfly/react-core/dist/js/components/Spinner"; import { AUTH_SESSION_NONE } from "../authSessions/AuthSessionApi"; +import { useQueryParams } from "../queryParams/QueryParamsContext"; +import { QueryParams } from "../navigation/Routes"; export function NewWorkspaceWithEmptyFilePage(props: { extension: string }) { const workspaces = useWorkspaces(); const history = useHistory(); const routes = useRoutes(); + const queryParams = useQueryParams(); useEffect(() => { workspaces @@ -51,9 +54,10 @@ export function NewWorkspaceWithEmptyFilePage(props: { extension: string }) { fileRelativePath: file.relativePathWithoutExtension, extension: file.extension, }), + search: queryParams.with(QueryParams.NEW_FILE, "new").toString(), }); }); - }, [routes, history, props.extension, workspaces]); + }, [routes, history, props.extension, workspaces, queryParams]); return ( diff --git a/packages/online-editor/src/navigation/Routes.ts b/packages/online-editor/src/navigation/Routes.ts index be2c210749c..b377ad440fe 100644 --- a/packages/online-editor/src/navigation/Routes.ts +++ b/packages/online-editor/src/navigation/Routes.ts @@ -23,6 +23,7 @@ export enum QueryParams { EXPAND = "expand", AUTH_SESSION_ID = "authSessionId", CONFIRM = "confirm", + NEW_FILE = "newFile", } export enum PathParams { @@ -135,6 +136,10 @@ export const routes = { queryParams: QueryParams.URL | QueryParams.BRANCH | QueryParams.AUTH_SESSION_ID | QueryParams.CONFIRM; }>(() => `/import`), + newFile: new Route<{ + queryParams: QueryParams.NEW_FILE; + }>(() => `/new`), + workspaceWithFilePath: new Route<{ pathParams: PathParams.WORKSPACE_ID | PathParams.FILE_RELATIVE_PATH | PathParams.EXTENSION; }>(({ workspaceId, fileRelativePath, extension }) => `/${workspaceId}/file/${fileRelativePath}.${extension}`), diff --git a/packages/workspaces-git-fs/src/hooks/WorkspaceFileHooks.tsx b/packages/workspaces-git-fs/src/hooks/WorkspaceFileHooks.tsx index 9a97c3e7ddf..1f45ecba543 100644 --- a/packages/workspaces-git-fs/src/hooks/WorkspaceFileHooks.tsx +++ b/packages/workspaces-git-fs/src/hooks/WorkspaceFileHooks.tsx @@ -46,6 +46,11 @@ export function useWorkspaceFilePromise(workspaceId: string | undefined, relativ return; } + //If my queryparam is in the URL when the add new file in the new file dropdown is clicked on + //Then - the workspaceId and relativePath will have the correct values for the new file and be set below. + //Else - the workspaceId and relativePath will have the correct values for the new file but be cancelled before it reaches the setWorkspaceFilePromise. + // Upon getting canceled it reverts to the workspaceId and relativePath of the current page and sets them to the current ones below. + setWorkspaceFilePromise({ data: { workspaceFile, uniqueId } }); }); });