[FEATURE] Hide repositories with zero issues

Is your feature request related to a problem? Please describe.
Currently, the Repositories page displays all repositories, including those with zero issues (vacancies). This can clutter the view, making it difficult to focus on repositories that have active vacancies.

Describe the solution you'd like
I propose adding a switch button (on/off or enable/disable style) that allows users to hide or show repositories with no vacancies.

Technical Notes:

By default, the switch should hide repositories with zero issues (disabled/off).
The selected value should be stored in localStorage for a stateful experience, so the preference persists across page reloads.
The behavior should also be enabled via a query string parameter.
Use the React Switch component for the implementation.

API Integration:
The API already includes the ability to filter out empty repositories. By adding a query string value of hide-empty=true to the URL, we can hide repositories/organizations with no issues/vacancies.

Hide: https://apibr.com/vagas/api/v1/repositories?per_page=10&page=1&hide-empty=true
Show: https://apibr.com/vagas/api/v1/repositories?per_page=10&page=1&hide-empty=false

Remarks:
For the first step, we can implement this feature solely on the front-end (UI) side in this repository. Later, we can extend the functionality to the back-end (API) side to enable filtering by query string as well.

Sample Code Snippet (ReactJS):

Here’s a basic implementation of the switch functionality using a React Switch component:

import React, { useEffect, useState } from 'react';
import Switch from 'react-switch'; // Make sure to install this package

const RepositoriesFilter = () => {
  const [hideEmpty, setHideEmpty] = useState(() => {
    // Get initial value from localStorage
    const savedValue = localStorage.getItem('hideEmpty');
    return savedValue === 'true' || false; // Default to false if not found
  });

  useEffect(() => {
    localStorage.setItem('hideEmpty', hideEmpty);
    // Optionally, you could also update the API call here
    const url = `https://apibr.com/vagas/api/v1/repositories?per_page=10&page=1&hide-empty=${hideEmpty}`;
    // Fetch data from the API
  }, [hideEmpty]);

  const handleToggle = () => {
    setHideEmpty(!hideEmpty);
  };

  return (
    <div>
      <label>
        Hide repositories with no vacancies:
        <Switch
          onChange={handleToggle}
          checked={hideEmpty}
          offColor="#888"
          onColor="#0f0"
        />
      </label>
    </div>
  );
};

export default RepositoriesFilter;

Acceptance Criteria:

Users can toggle the switch to hide/show repositories with zero issues.
The selected preference is stored in localStorage.
The feature is implemented on the front-end, and the functionality for API integration is set up for future development.

ApiBR / vagas-aggregator-ui

[FEATURE] Hide repositories with zero issues #88