From 2c00ae92af09ce9063759a1518564058de918d86 Mon Sep 17 00:00:00 2001 From: Oran C Date: Fri, 29 Oct 2021 12:50:43 -0700 Subject: [PATCH] [add] build regex --- src/Dashboard.js | 5 +- src/PatternSelector.js | 134 ++++++++++++++++++++++++---------------- src/lib/patternParse.js | 10 +-- 3 files changed, 88 insertions(+), 61 deletions(-) diff --git a/src/Dashboard.js b/src/Dashboard.js index 86daf21..15d046c 100644 --- a/src/Dashboard.js +++ b/src/Dashboard.js @@ -5,6 +5,7 @@ import Deposits from './Deposits'; import Orders from './Orders'; import Main from "./Main" import Title from './Title'; + import PatternGen from './PatternGen'; import RegexReplace from "./RegexReplace" import PatternSelector from './PatternSelector'; @@ -217,14 +218,14 @@ monaco.editor.defineTheme('myCoolTheme', { p: 2, display: 'flex', flexDirection: 'column', - height: 800, + // height: 800, }} > <>

Regex Replace

- +

Generate Text Using Regex Expressions

diff --git a/src/PatternSelector.js b/src/PatternSelector.js index 52ad3c3..1a0faf7 100644 --- a/src/PatternSelector.js +++ b/src/PatternSelector.js @@ -1,18 +1,23 @@ import React from "react" -import { useState } from "react" +import { useState, useEffect } from "react" import { styled } from '@mui/material/styles'; import { useTheme } from '@mui/material/styles'; import Chip from '@mui/material/Chip'; import Paper from '@mui/material/Paper'; import TagFacesIcon from '@mui/icons-material/TagFaces'; - +import TextField from '@mui/material/TextField'; import Box from '@mui/material/Box'; import OutlinedInput from '@mui/material/OutlinedInput'; import InputLabel from '@mui/material/InputLabel'; import MenuItem from '@mui/material/MenuItem'; import FormControl from '@mui/material/FormControl'; import Select from '@mui/material/Select'; - +import Stack from '@mui/material/Stack'; + +import patternParse from "./lib/patternParse"; +import { Button } from "@mui/material"; +import { Label } from "@mui/icons-material"; + const ITEM_HEIGHT = 48; const ITEM_PADDING_TOP = 8; const MenuProps = { @@ -24,20 +29,23 @@ const MenuProps = { }, }; - +let key_start = 5 const names = [ - 'Oliver Hansen', - 'Van Henry', - 'April Tucker', - 'Ralph Hubbard', - 'Omar Alexander', - 'Carlos Abbott', - 'Miriam Wagner', - 'Bradley Wilkerson', - 'Virginia Andrews', - 'Kelly Snyder', -]; + { name: "Control Characters", label: 'CONTROL' }, + { name: "Symbols", label: 'SYMBOLS' }, + { name: "Letters", label: 'LETTERS' }, + { name: "Numbers", label: 'NUMBERS' } +] + +// = [ +// 'Control Characters', +// 'Numbers', +// 'Letters', +// 'Symbols' +// ]; + + function getStyles(name, personName, theme) { return { @@ -52,9 +60,10 @@ const ListItem = styled('li')(({ theme }) => ({ margin: theme.spacing(0.5), })); -const PatternSelector = () => { +const PatternSelector = ({ editor }) => { const theme = useTheme(); const [personName, setPersonName] = React.useState([]); + const [regexpattern, setSetRegexPattern] = useState("") const handleChange = (event) => { const { @@ -64,27 +73,60 @@ const PatternSelector = () => { // On autofill we get a the stringified value. typeof value === 'string' ? value.split(',') : value, ); + key_start += 1 + setChipData(chipData.concat({ key: key_start, label: value })) }; + const Control = { key: 0, label: 'CONTROL' } + const Symbol = { key: 1, label: 'SYMBOLS' } + const Letter = { key: 2, label: 'LETTERS' } + const Number = { key: 3, label: 'NUMBERS' } + const [chipData, setChipData] = React.useState([ - { key: 0, label: 'Angular' }, - { key: 1, label: 'jQuery' }, - { key: 2, label: 'Polymer' }, - { key: 3, label: 'React' }, - { key: 4, label: 'Vue.js' }, + // Control, + // Symbol, + // Letter, + // Number ]); const handleDelete = (chipToDelete) => () => { setChipData((chips) => chips.filter((chip) => chip.key !== chipToDelete.key)); }; + + useEffect(() => { + + let tokens = { + CONTROL: `([\\t\\n\\r]+)`, + NUMBERS: `(0|[1-9][0-9]*)`, + LETTERS: `([a-zA-Z]+)`, + SYMBOLS: `([^\\s\\t\\r\\-a-zA-Z0-9]+)` + } + let parsed = chipData.map(x => x.label) + let string_regex = parsed.reduce((accumulator, value, index, array) => { + return accumulator + tokens[value] + }, "") + setSetRegexPattern(`/${string_regex}/g`) + + }, [chipData]) return ( -
+ + +

Build Regex Pattern (Easy)

+ + { ); })} -
- - Chip - - -
+ + + {names.map((value, key) => { + return + })} + + + ); } diff --git a/src/lib/patternParse.js b/src/lib/patternParse.js index cf301d0..c4693e9 100644 --- a/src/lib/patternParse.js +++ b/src/lib/patternParse.js @@ -12,14 +12,14 @@ let lexer = moo.compile({ // CONTROL: /[ \t]+/, CONTROL: { match: /[ \t\n\r]+/, lineBreaks: true }, // comment: /\/\/.*?$/, - numbers: /0|[1-9][0-9]*/, - letters: /[a-zA-Z]+/, + NUMBERS: /0|[1-9][0-9]*/, + LETTERS: /[a-zA-Z]+/, // punctuation: /[\.,'";&:!?]+/, - symbols: /[\.,'";&:!?`~@#$%^*|\}\]\(\)]+/, + SYMBOLS: /[^\s\t\r\-0-9a-zA-Z]+/, // string: /"(?:\\["\\]|[^\n"\\])*"/, // lparen: '(', // rparen: ')', - keyword: [`'while'`, 'if', 'else', 'moo', 'cows'], + // keyword: [`'while'`, 'if', 'else', 'moo', 'cows'], // newline: { match: /\n/, lineBreaks: false }, }) @@ -49,7 +49,7 @@ const patternParse =(input,include_range=false)=>{ } console.log(patternParse("aaaa1111")) -console.log(patternParse("while4")) +console.log(patternParse("Example Text to convert into csv!")) input_example = "\n3333bbbbb" // patternParse(input_example)[2]