From b9b5d4c6d124468a3490beafa946228accb89342 Mon Sep 17 00:00:00 2001 From: filip mertens Date: Tue, 22 Feb 2022 09:23:52 +0100 Subject: [PATCH] replace without confirming --- .../components/modals/modal-wrapper.tsx | 4 ++- .../src/lib/remix-app/context/provider.tsx | 10 +++--- .../app/src/lib/remix-app/interface/index.ts | 3 +- .../app/src/lib/remix-app/reducer/modals.ts | 3 +- .../modal-dialog/src/lib/types/index.ts | 3 +- .../src/lib/components/OverWriteCheck.tsx | 33 +++++++++++++++++++ .../search/src/lib/components/Search.tsx | 2 ++ .../src/lib/components/results/ResultItem.tsx | 13 ++++++-- .../lib/components/results/ResultSummary.tsx | 12 ++++++- .../search/src/lib/context/context.tsx | 25 +++++++++++--- .../search/src/lib/reducers/Reducer.ts | 17 ++++++++-- libs/remix-ui/search/src/lib/types/index.ts | 7 ++-- 12 files changed, 112 insertions(+), 20 deletions(-) create mode 100644 libs/remix-ui/search/src/lib/components/OverWriteCheck.tsx diff --git a/libs/remix-ui/app/src/lib/remix-app/components/modals/modal-wrapper.tsx b/libs/remix-ui/app/src/lib/remix-app/components/modals/modal-wrapper.tsx index cf5456dc38..12644f5fa7 100644 --- a/libs/remix-ui/app/src/lib/remix-app/components/modals/modal-wrapper.tsx +++ b/libs/remix-ui/app/src/lib/remix-app/components/modals/modal-wrapper.tsx @@ -10,6 +10,7 @@ interface ModalWrapperProps extends ModalDialogProps { const ModalWrapper = (props: ModalWrapperProps) => { const [state, setState] = useState() const ref = useRef() + const data = useRef() const onFinishPrompt = async () => { if (ref.current === undefined) { @@ -21,7 +22,7 @@ const ModalWrapper = (props: ModalWrapperProps) => { } const onOkFn = async () => { - (props.okFn) ? props.okFn() : props.resolve(true) + (props.okFn) ? props.okFn(data.current) : props.resolve(data.current || true) } const onCancelFn = async () => { @@ -37,6 +38,7 @@ const ModalWrapper = (props: ModalWrapperProps) => { } useEffect(() => { + data.current = props.data if (props.modalType) { switch (props.modalType) { case ModalTypes.prompt: diff --git a/libs/remix-ui/app/src/lib/remix-app/context/provider.tsx b/libs/remix-ui/app/src/lib/remix-app/context/provider.tsx index 5d9a3a5815..2aca27c1be 100644 --- a/libs/remix-ui/app/src/lib/remix-app/context/provider.tsx +++ b/libs/remix-ui/app/src/lib/remix-app/context/provider.tsx @@ -15,18 +15,18 @@ export const ModalProvider = ({ children = [], reducer = modalReducer, initialSt }) } - const modal = (data: AppModal) => { - const { id, title, message, okLabel, okFn, cancelLabel, cancelFn, modalType, defaultValue, hideFn } = data + const modal = (modalData: AppModal) => { + const { id, title, message, okLabel, okFn, cancelLabel, cancelFn, modalType, defaultValue, hideFn, data } = modalData return new Promise((resolve, reject) => { dispatch({ type: modalActionTypes.setModal, - payload: { id, title, message, okLabel, okFn, cancelLabel, cancelFn, modalType: modalType || ModalTypes.default, defaultValue: defaultValue, hideFn, resolve, next: onNextFn } + payload: { id, title, message, okLabel, okFn, cancelLabel, cancelFn, modalType: modalType || ModalTypes.default, defaultValue: defaultValue, hideFn, resolve, next: onNextFn, data } }) }) } - const alert = (data: AlertModal) => { - return modal({ id: data.id, title: data.title || 'Alert', message: data.message || data.title, okLabel: 'OK', okFn: (value?:any) => {}, cancelLabel: '', cancelFn: () => {} }) + const alert = (modalData: AlertModal) => { + return modal({ id: modalData.id, title: modalData.title || 'Alert', message: modalData.message || modalData.title, okLabel: 'OK', okFn: (value?:any) => {}, cancelLabel: '', cancelFn: () => {} }) } const handleHideModal = () => { diff --git a/libs/remix-ui/app/src/lib/remix-app/interface/index.ts b/libs/remix-ui/app/src/lib/remix-app/interface/index.ts index af25ce13b9..f31536678e 100644 --- a/libs/remix-ui/app/src/lib/remix-app/interface/index.ts +++ b/libs/remix-ui/app/src/lib/remix-app/interface/index.ts @@ -15,7 +15,8 @@ export interface AppModal { defaultValue?: string hideFn?: () => void, resolve?: (value?:any) => void, - next?: () => void + next?: () => void, + data?: any } export interface AlertModal { diff --git a/libs/remix-ui/app/src/lib/remix-app/reducer/modals.ts b/libs/remix-ui/app/src/lib/remix-app/reducer/modals.ts index 8a1c89ac79..a50a3dbd66 100644 --- a/libs/remix-ui/app/src/lib/remix-app/reducer/modals.ts +++ b/libs/remix-ui/app/src/lib/remix-app/reducer/modals.ts @@ -20,7 +20,8 @@ export const modalReducer = (state: ModalState = ModalInitialState, action: Moda defaultValue: action.payload.defaultValue, hideFn: action.payload.hideFn, resolve: action.payload.resolve, - next: action.payload.next + next: action.payload.next, + data: action.payload.data } const modalList: AppModal[] = state.modals.slice() diff --git a/libs/remix-ui/modal-dialog/src/lib/types/index.ts b/libs/remix-ui/modal-dialog/src/lib/types/index.ts index db473683d1..a8793971d7 100644 --- a/libs/remix-ui/modal-dialog/src/lib/types/index.ts +++ b/libs/remix-ui/modal-dialog/src/lib/types/index.ts @@ -14,5 +14,6 @@ export interface ModalDialogProps { handleHide: (hideState?: boolean) => void, children?: React.ReactNode, resolve?: (value?:any) => void, - next?: () => void + next?: () => void, + data?: any } diff --git a/libs/remix-ui/search/src/lib/components/OverWriteCheck.tsx b/libs/remix-ui/search/src/lib/components/OverWriteCheck.tsx new file mode 100644 index 0000000000..dfe193ca9e --- /dev/null +++ b/libs/remix-ui/search/src/lib/components/OverWriteCheck.tsx @@ -0,0 +1,33 @@ +import React, { useContext, useEffect, useRef, useState } from 'react' +import { SearchContext } from '../context/context' + +export const OverWriteCheck = props => { + const { setReplaceWithoutConfirmation } = useContext(SearchContext) + + const change = e => { + console.log(e.target.checked) + setReplaceWithoutConfirmation(e.target.checked) + } + + return ( + <> +
+
+ + +
+
+ + ) +} diff --git a/libs/remix-ui/search/src/lib/components/Search.tsx b/libs/remix-ui/search/src/lib/components/Search.tsx index 05a856832e..3df0d37a4a 100644 --- a/libs/remix-ui/search/src/lib/components/Search.tsx +++ b/libs/remix-ui/search/src/lib/components/Search.tsx @@ -6,6 +6,7 @@ import '../search.css' import { Include } from './Include' import { Exclude } from './Exclude' import { Replace } from './Replace' +import { OverWriteCheck } from './OverWriteCheck' export const SearchTab = props => { @@ -19,6 +20,7 @@ return ( + diff --git a/libs/remix-ui/search/src/lib/components/results/ResultItem.tsx b/libs/remix-ui/search/src/lib/components/results/ResultItem.tsx index baf61ecaca..b9522ed1c1 100644 --- a/libs/remix-ui/search/src/lib/components/results/ResultItem.tsx +++ b/libs/remix-ui/search/src/lib/components/results/ResultItem.tsx @@ -1,4 +1,4 @@ -import React, { useContext, useEffect, useState } from 'react' +import React, { useContext, useEffect, useRef, useState } from 'react' import { SearchContext } from '../../context/context' import { SearchResult, SearchResultLine } from '../../types' import { ResultFileName } from './ResultFileName' @@ -9,15 +9,23 @@ interface ResultItemProps { } export const ResultItem = (props: ResultItemProps) => { - const { state, findText } = useContext(SearchContext) + const { state, findText, disableForceReload } = useContext(SearchContext) const [loading, setLoading] = useState(false) const [lines, setLines] = useState([]) const [toggleExpander, setToggleExpander] = useState(false) + const reloadTimeOut = useRef(null) useEffect(() => { reload() }, [props.file.timeStamp]) + useEffect(() => { + if(props.file.forceReload){ + clearTimeout(reloadTimeOut.current) + reloadTimeOut.current = setTimeout(() => reload(), 1000) + } + }, [props.file.forceReload]) + const toggleClass = () => { setToggleExpander(!toggleExpander) } @@ -30,6 +38,7 @@ export const ResultItem = (props: ResultItemProps) => { findText(props.file.filename).then(res => { setLines(res) setLoading(false) + disableForceReload(props.file.filename) }) } diff --git a/libs/remix-ui/search/src/lib/components/results/ResultSummary.tsx b/libs/remix-ui/search/src/lib/components/results/ResultSummary.tsx index e9b468b019..90f03991a7 100644 --- a/libs/remix-ui/search/src/lib/components/results/ResultSummary.tsx +++ b/libs/remix-ui/search/src/lib/components/results/ResultSummary.tsx @@ -1,3 +1,4 @@ +import { useDialogDispatchers } from 'libs/remix-ui/app/src/lib/remix-app/context/provider' import React, { useContext } from 'react' import { SearchContext } from '../../context/context' import { SearchResult, SearchResultLine, SearchResultLineLine } from '../../types' @@ -10,11 +11,12 @@ interface ResultSummaryProps { export const ResultSummary = (props: ResultSummaryProps) => { const { hightLightInPath, replaceText, state } = useContext(SearchContext) + const { modal } = useDialogDispatchers() const selectLine = async (line: SearchResultLineLine) => { await hightLightInPath(props.searchResult, line) } - const replace = async (line: SearchResultLineLine) => { + const confirmReplace = async (line: SearchResultLineLine) => { props.setLoading(true) try{ await replaceText(props.searchResult, line) @@ -23,6 +25,14 @@ export const ResultSummary = (props: ResultSummaryProps) => { } } + const replace = async (line: SearchResultLineLine) => { + if(state.replaceWithOutConfirmation){ + confirmReplace(line) + }else{ + modal({ id: 'matomoModal', title: 'Replace', message: `Are you sure you want to replace '${line.center}' by '${state.replace}' in ${props.searchResult.filename}?`, okLabel: 'Yes', okFn: confirmReplace, cancelLabel: 'No', cancelFn: ()=>{}, data: line }) + } + } + return ( <> {props.line.lines.map((lineItem, index) => ( diff --git a/libs/remix-ui/search/src/lib/context/context.tsx b/libs/remix-ui/search/src/lib/context/context.tsx index 7d5b13c71e..d4e50f3814 100644 --- a/libs/remix-ui/search/src/lib/context/context.tsx +++ b/libs/remix-ui/search/src/lib/context/context.tsx @@ -33,6 +33,8 @@ export interface SearchingStateInterface { toggleCaseSensitive: () => void toggleMatchWholeWord: () => void toggleUseRegex: () => void + setReplaceWithoutConfirmation: (value: boolean) => void + disableForceReload: (file: string) => void } export const SearchContext = createContext(null) @@ -120,6 +122,18 @@ export const SearchProvider = ({ payload: undefined }) }, + setReplaceWithoutConfirmation: (value: boolean) => { + dispatch({ + type: 'SET_REPLACE_WITHOUT_CONFIRMATION', + payload: value + }) + }, + disableForceReload: (file: string) => { + dispatch({ + type: 'DISABLE_FORCE_RELOAD', + payload: file + }) + }, findText: async (path: string) => { if (!plugin) return try { @@ -165,10 +179,12 @@ export const SearchProvider = ({ } const reloadStateForFile = async (file: string) => { - clearTimeout(reloadTimeOut.current) - reloadTimeOut.current = setTimeout(async () => { + //clearTimeout(reloadTimeOut.current) + console.log('reload file', file) + //reloadTimeOut.current = setTimeout(async () => { + console.log('calling file', file) await value.reloadFile(file) - }, 1000) + //}, 1000) } useEffect(() => { @@ -198,7 +214,8 @@ export const SearchProvider = ({ filename: file, lines: [], path: file, - timeStamp: Date.now() + timeStamp: Date.now(), + forceReload: false } return r }) diff --git a/libs/remix-ui/search/src/lib/reducers/Reducer.ts b/libs/remix-ui/search/src/lib/reducers/Reducer.ts index 2738caa95f..0ead0fac4d 100644 --- a/libs/remix-ui/search/src/lib/reducers/Reducer.ts +++ b/libs/remix-ui/search/src/lib/reducers/Reducer.ts @@ -51,11 +51,24 @@ export const SearchReducer = (state: SearchState = SearchingInitialState, action ...state, matchWord: !state.matchWord, timeStamp: Date.now() - } + } + case 'SET_REPLACE_WITHOUT_CONFIRMATION': + return { + ...state, + replaceWithOutConfirmation: action.payload, + } + case 'DISABLE_FORCE_RELOAD': + if (state.searchResults) { + const findFile = state.searchResults.find(file => file.filename === action.payload) + if (findFile) findFile.forceReload = false + } + return { + ...state, + } case 'RELOAD_FILE': if (state.searchResults) { const findFile = state.searchResults.find(file => file.filename === action.payload) - if (findFile) findFile.timeStamp = Date.now() + if (findFile) findFile.forceReload = true } return { ...state, diff --git a/libs/remix-ui/search/src/lib/types/index.ts b/libs/remix-ui/search/src/lib/types/index.ts index 4521bfb658..7b3d06e1b3 100644 --- a/libs/remix-ui/search/src/lib/types/index.ts +++ b/libs/remix-ui/search/src/lib/types/index.ts @@ -29,7 +29,8 @@ export interface SearchResult { filename: string, path: string, lines: SearchResultLine[], - timeStamp: number + timeStamp: number, + forceReload: boolean } export interface SearchState { @@ -40,8 +41,9 @@ export interface SearchState { exclude: string, casesensitive: boolean, matchWord: boolean, + replaceWithOutConfirmation: boolean, useRegExp: boolean, - timeStamp: number + timeStamp: number, } export const SearchingInitialState: SearchState = { @@ -53,5 +55,6 @@ export const SearchingInitialState: SearchState = { casesensitive: false, matchWord: false, useRegExp: false, + replaceWithOutConfirmation: false, timeStamp: 0 } \ No newline at end of file