Active post modes

[Luiginicoletti]

Pull Request
Closes #502

Feature

Nesse PR criamos o componente define uma store global para gerenciar o estado das contas de redes sociais utilizando a biblioteca **Zustand**

Ele permite adicionar e remover contas, mantendo a lista de contas atualizada de forma reativa.

Funcionalidades Principais:

Definição de Tipos:

AccountPost: Tipo que representa uma conta simplificada, contendo apenas os campos id, socialMediaId e userName.
StoreState: Tipo que define a estrutura da store, incluindo uma lista de contas e funções para adicionar e remover contas.

Criação da Store:

A store é criada usando a função create do Zustand, que inicializa um estado com uma lista de contas vazia e define as funções para manipulação desse estado.

Funções da Store:

addAccount: Adiciona uma nova conta à lista de contas.
Cada conta é representada por seu id, socialMediaId e userName.
removeAccount: Remove uma conta da lista de contas com base no id da conta.

Bugfix

Alteramos a lógica de preenchimento das abas de redes sociais no componente Tabber, que antes utilizava uma mock-API, para consumir dados de um estado global gerenciado com Zustand. Corrigimos várias incompatibilidades e garantimos que as abas refletem corretamente o estado dos switches das contas de redes sociais na sidebar.

Precisamos corrigir algumas incompatibilidades para a migracao da fonte dos dados:
As incompatibilidades surgiram devido à transição do uso de uma mock-API para um estado global.
Antes, as contas eram carregadas e exibidas diretamente a partir de dados mockados, sem integração real com os switches na sidebar.

• Substituímos a fonte de dados mockada por um estado global com Zustand, que agora reflete o estado dos switches.
• Implementamos verificações de tipo para garantir que as funções de manipulação de estados recebam e tratem corretamente os dados.
• Adicionamos lógica para garantir que a última aba seja removida corretamente quando a última conta de rede social for desativada.
• Corrigimos a inicialização de estados para prevenir erros de tipos e garantir uma transição suave quando os dados mudam.

Changelog

- Substituição da lógica de preenchimento de abas de redes sociais do componente `Tabber` para consumir dados do estado global gerenciado pelo Zustand. - Correção de incompatibilidades de tipo entre `AccountPost` e `Account`. - Adição de verificações de segurança para assegurar a correta manipulação de estados e dados. - Implementação de lógica para remover a última aba corretamente ao desativar a última conta.

Visual evidences 🖼️

Checklist

Issue linked Build working correctly Tests created

Additional info

Estado Global: O Zustand agora gerencia o estado das contas de redes sociais ativas, refletindo diretamente os switches na sidebar. Verificação de Tipos: Melhoramos a verificação de tipos em várias partes do código para garantir que os dados são manipulados corretamente. Melhorias na Interface: As abas agora reagem dinamicamente às mudanças nos switches, proporcionando uma melhor experiência do usuário e uma interface mais consistente.

[DominMFD]

Amassou Nico, parabéns!!!

[DominMFD]

Amassou Nico, parabéns!!!

[juliaam]

Se há o if para cair no initialTabId, o accounts.length > 0 vai ser sempre true, não há necessidade de fazer a mesma verificação dentro do if

Suggested change

	if (accounts.length > 0) {
	const initialTabId = accounts.length > 0 ? makeId(accounts[0]) : '';
	setCurrentTab(initialTabId as TabId);
	if (accounts.length > 0) {
	const initialTabId = makeId(accounts[0]);
	setCurrentTab(initialTabId);

[juliaam]

Necessário esse unknown? Por que?

Suggested change

	setCurrentTab('' as unknown as TabId);
	setCurrentTab('' as TabId);

[juliaam]

O socialMedias precisa ficar nas dependências do useEffect? O tab não tem que ser setado apenas quando accounts mudar, que é na troca do activateSocialTab?

[juliaam]

Aqui já vai ser retornado PostMode ou undefined

Suggested change

	postMode={currentPostMode ?? undefined}
	postMode={currentPostMode}

[juliaam]

Seria desejável colocar tabs[currentTab].posts[tabs[currentTab].postModeOnView]?.text ?? em uma variável e trocar os locais onde é chamada, seria uma sugestão, algo como:

Suggested change

	tabs[currentTab].posts[tabs[currentTab].postModeOnView]?.text ??
	''
	postModeOnViewText ?? ''

(reveja o nome da variável)

[juliaam]

Precisa corrigir os problemas das actions

[github-actions]

Coverage Report

Status	Category	Percentage	Covered / Total
🔵	Lines	67.12%	341 / 508
🔵	Statements	67.02%	374 / 558
🔵	Functions	67.59%	146 / 216
🔵	Branches	53.54%	136 / 254

File Coverage

File	Stmts	% Branch	% Funcs	% Lines	Uncovered Lines
Changed Files
src/components/Tabber/Tabber.tsx	0%	0%	0%	0%	20-21, 21, 24-25, 27-28, 30, 32-41, 33-40, 34-36, 38-39, 43-52, 44, 44-47, 47-50, 50, 54, 56-68, 57, 57-62, 61, 64-67, 70-72, 71, 74-87, 75, 75-77, 79-81, 80, 83-86, 89-91
src/components/Tabber/utils.ts	0%	0%	0%	0%	11-18, 14-16, 15, 17, 20-23, 21, 21-22, 25-51, 29-31, 30, 33-50, 34-36, 36, 38, 40-47, 49
src/components/Tabber/Tabs/Tabs.tsx	0%	0%	0%	0%	14, 16-17, 17, 19-20, 20, 26, 36
src/pages/home/components/Sidebar/components/SocialAccordion/SocialAccordion.tsx	58.33%	50%	60%	62.5%	25, 25-26, 26, 39
src/stores/useAccountStore.ts	28.57%	100%	16.66%	25%	20-29, 20-29, 33-35, 33-35, 34

Generated in workflow #1334