refactor: improve readability of several components (#3714)

* refactor to improve readability

* refactor to improve readability

* refactor to improve readability

* refactor to improve readability

* refactor to improve readability

* refactor to improve readability

* refactor to improve readability

* refactor to improve readability

* ✅ (Simple Agent.spec.ts): update expected count of python words to 2 for accurate test results
📝 (auto-login-off.spec.ts): add a 1-second timeout before checking visibility of a text element to ensure proper rendering and improve test reliability

* 📝 (cardComponent/index.tsx): Extract handlePlaygroundClick function to improve code readability and maintainability
📝 (codeAreaComponent/index.tsx): Refactor code to use consistent naming conventions and improve code structure
📝 (rename-label.tsx): Refactor code to use consistent naming conventions and improve code structure
📝 (dictAreaModal/index.tsx): Refactor code to use consistent naming conventions and improve code structure

* 🔧 (rename-label.tsx): Refactor RenameLabel component to improve readability and maintainability by restructuring the component logic into separate functions for handling blur, change, and double click events. Split the component rendering logic into separate functions for input and span elements.

* update type

* [autofix.ci] apply automated fixes

---------

Co-authored-by: anovazzi1 <otavio2204@gmail.com>
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

src/frontend/tests/end-to-end/auto-login-off.spec.ts

@@ -217,6 +217,8 @@ test("when auto_login is false, admin can CRUD user's and should see just your o
     timeout: 30000,
   });
 
+  await page.waitForTimeout(1000);
+
   expect(
     await page.getByText(secondRandomFlowName, { exact: true }).isVisible(),
   ).toBe(true);