fix(curriculum): added the new version and fixed typos in lec-working-with-regular-exp (freeCodeCamp#63592)

Author: Hrishik03

curriculum/challenges/english/blocks/lecture-working-with-regular-expressions/6733c5e54e3a154c8078ed48.md

@@ -5,7 +5,7 @@ challengeType: 19
 dashedName: what-are-regex-quantifiers-and-how-do-they-work
 ---
 
-# --description--
+# --interactive--
 
 Let's learn about quantifiers in regular expressions.
 
@@ -25,6 +25,8 @@ const regex = /^\d{4}$/;
 
 Notice how our quantifier contains only the number `4`. This syntax means "match the previous character exactly four times". Let's see how that behaves:
 
+:::interactive_editor
+
 ```js
 const regex = /^\d{4}$/;
 console.log(regex.test("123")); // false
@@ -34,6 +36,8 @@ console.log(regex.test("123456")); // false
 console.log(regex.test("1234567")); // false
 ```
 
+:::
+
 The pattern only matches the string with exactly four digits, because we have used the anchors and our quantifier only allows exactly four digits. But maybe the identification code only needs to be a minimum of four digits.
 
 To allow for four or more digits, add a comma after the number in your quantifier:
@@ -44,6 +48,8 @@ const regex = /^\d{4,}$/;
 
 Now, our syntax allows the pattern to match four or more digits. Let's test it:
 
+:::interactive_editor
+
 ```js
 const regex = /^\d{4,}$/;
 console.log(regex.test("123")); // false
@@ -53,6 +59,8 @@ console.log(regex.test("123456")); // true
 console.log(regex.test("1234567")); // true
 ```
 
+:::
+
 A seven-digit identifier is rather long. These identifiers should have a maximum of 6 digits, and a minimum of 4 digits. To achieve this, you can add a second number to your quantifier after the comma:
 
 ```js
@@ -61,6 +69,8 @@ const regex = /^\d{4,6}$/;
 
 And now our pattern no longer matches the seven-digit identifier, because it is greater than our six-digit maximum.
 
+:::interactive_editor
+
 ```js
 const regex = /^\d{4,6}$/;
 console.log(regex.test("123")); // false
@@ -70,12 +80,14 @@ console.log(regex.test("123456")); // true
 console.log(regex.test("1234567")); // false
 ```
 
+:::
+
 Note that you cannot use this syntax to set a maximum alone – you must always set a minimum. But if you set the minimum to `1`, you can effectively achieve the same result.
 
 We've received updated requirements from our users. Identifiers can now optionally start with a letter. We already know the character class for this, so let's add that to our regular expression:
 
 ```js
-const regex = /^[a-zA-z]\d{4,6}$/;
+const regex = /^[a-zA-Z]\d{4,6}$/;
 ```
 
 But now we mandate the presence of a letter. How can we make it optional?
@@ -94,6 +106,8 @@ const regex = /^[a-zA-Z]?\d{4,6}$/;
 
 We should validate the result:
 
+:::interactive_editor
+
 ```js
 const regex = /^[a-zA-Z]?\d{4,6}$/;
 console.log(regex.test("123")); // false
@@ -104,6 +118,8 @@ console.log(regex.test("X123456")); // true
 console.log(regex.test("1234567")); // false
 ```
 
+:::
+
 Our pattern now allows for a single optional letter, followed by four to six digits.
 
 Unfortunately, we've just realized we read the requirements wrong. We need to allow for any number of letters before the numbers. We can use our quantifier with a `0` minimum and no defined maximum:
@@ -114,6 +130,8 @@ const regex = /^[a-zA-Z]{0,}\d{4,6}$/;
 
 But our pattern is getting long again. Thankfully, there's another short-hand for "match the previous character zero or more times" –  the asterisk (`*`) symbol. Let's replace our quantifier with that in the pattern, and test it:
 
+:::interactive_editor
+
 ```js
 const regex = /^[a-zA-Z]*\d{4,6}$/;
 console.log(regex.test("123")); // false
@@ -124,10 +142,14 @@ console.log(regex.test("X123456")); // true
 console.log(regex.test("1234567")); // false
 ```
 
+:::
+
 Now we successfully match any identifier with zero or more letters followed by four to six numbers. But it turns out this is crashing our system – we actually have to require at least one letter.
 
 Again, we could use a quantifier with a minimum of one and no defined maximum, or we could use yet another special syntax – the plus (`+`) symbol:
 
+:::interactive_editor
+
 ```js
 const regex = /^[a-zA-Z]+\d{4,6}$/;
 console.log(regex.test("123")); // false
@@ -138,6 +160,8 @@ console.log(regex.test("X123456")); // true
 console.log(regex.test("1234567")); // false
 ```
 
+:::
+
 Now the identifiers that do not start with at least one letter fail, regardless of how many numbers there are.
 
 You can use quantifiers to greatly enhance the brevity and readability of your regular expressions.