feat(StatsData): combine props into 1 object

szvitek · Apr 5, 2024 · 11a762a · 11a762a
1 parent 6819243
commit 11a762a
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 18 deletions.
diff --git a/src/components/Container.jsx b/src/components/Container.jsx
@@ -4,20 +4,17 @@ import Textarea from './Textarea';
 
 export default function Container() {
   const [text, setText] = useState('');
-  const numberOfWords = text.split(/\s/).filter(word => word).length;
-  const numberOfCharacters = text.length;
-  const igCharsLeft = 280 - numberOfCharacters;
-  const fbCharsLeft = 2200 - numberOfCharacters;
+  const stats = {
+    numberOfWords: text.split(/\s/).filter((word) => word).length,
+    numberOfCharacters: text.length,
+    igCharsLeft: 280 - text.length,
+    fbCharsLeft: 2200 - text.length,
+  };
 
   return (
     <main className="container">
       <Textarea text={text} setText={setText} />
-      <Stats
-        numberOfWords={numberOfWords}
-        numberOfCharacters={numberOfCharacters}
-        igCharsLeft={igCharsLeft}
-        fbCharsLeft={fbCharsLeft}
-      />
+      <Stats stats={stats} />
     </main>
   );
 }
diff --git a/src/components/Stats.jsx b/src/components/Stats.jsx
@@ -1,15 +1,12 @@
 export default function Stats({
-  numberOfWords,
-  numberOfCharacters,
-  igCharsLeft,
-  fbCharsLeft,
+  stats
 }) {
   return (
     <section className="stats">
-      <Stat label="Words" number={numberOfWords} />
-      <Stat label="Characters" number={numberOfCharacters} />
-      <Stat label="Instagram" number={igCharsLeft} />
-      <Stat label="Facebook" number={fbCharsLeft} />
+      <Stat label="Words" number={stats.numberOfWords} />
+      <Stat label="Characters" number={stats.numberOfCharacters} />
+      <Stat label="Instagram" number={stats.igCharsLeft} />
+      <Stat label="Facebook" number={stats.fbCharsLeft} />
     </section>
   );
 }