Tabs switching logic fixed

This commit is contained in:
Lucas Oliveira 2023-02-22 23:40:16 -03:00
commit f49fa04d67
3 changed files with 16 additions and 16 deletions

View file

@ -30,17 +30,17 @@ export function TabsProvider({children}){
function removeFlow(id:string){ function removeFlow(id:string){
setFlows(prevState=>{ setFlows(prevState=>{
const newFlows = [...prevState]; const newFlows = [...prevState];
const index = newFlows.findIndex(flow=>flow.id===id) const index = newFlows.findIndex(flow=>flow.id===id);
if(index!==-1){ if(index >= 0){
newFlows.splice(index,1) if(index===tabIndex){
} setTabIndex(flows.length-2);
if(index===tabIndex){ newFlows.splice(index,1);
if(tabIndex===0){ } else {
// let flowId = flows[tabIndex].id;
} newFlows.splice(index,1);
else{ setTabIndex(newFlows.findIndex(flow=>flow.id === flowId));
setTabIndex(tabIndex-1)
} }
} }
window.sessionStorage.setItem('tabs', JSON.stringify(newFlows)); window.sessionStorage.setItem('tabs', JSON.stringify(newFlows));
return newFlows; return newFlows;
@ -48,10 +48,11 @@ export function TabsProvider({children}){
} }
function addFlow(newFlow: flow) { function addFlow(newFlow: flow) {
setFlows(prevState => { setFlows(prevState => {
const newFlows = [...prevState, newFlow]; const newFlows = [...prevState, newFlow];
window.sessionStorage.setItem('tabs', JSON.stringify(newFlows)); window.sessionStorage.setItem('tabs', JSON.stringify(newFlows));
return newFlows; return newFlows;
}); });
setTabIndex(flows.length);
} }
function updateFlow(newFlow:flow){ function updateFlow(newFlow:flow){
setFlows(prevState=>{ setFlows(prevState=>{

View file

@ -20,7 +20,6 @@ export function TabsManager() {
<div className="h-full w-full flex flex-col"> <div className="h-full w-full flex flex-col">
<div className="w-full flex pr-2 flex-row text-center items-center bg-gray-100"> <div className="w-full flex pr-2 flex-row text-center items-center bg-gray-100">
{flows.map((flow, index) => { {flows.map((flow, index) => {
console.log(tabIndex);
return ( return (
<TabComponent <TabComponent
onClick={() => setTabIndex(index)} onClick={() => setTabIndex(index)}

View file

@ -13,7 +13,7 @@ export default function TabComponent({ selected, flow, onClick }) {
{flow ? ( {flow ? (
!selected ? ( !selected ? (
<div <div
className="flex justify-between select-none truncate w-44 items-center px-4 my-2 mt-3 border-x border-gray-300 -ml-px" className="flex justify-between select-none truncate w-44 items-center px-4 my-2 mt-3 border-x border-t border-t-transparent border-gray-300 -ml-px"
onClick={onClick} onClick={onClick}
> >
{flow.name} {flow.name}
@ -68,7 +68,7 @@ export default function TabComponent({ selected, flow, onClick }) {
) : ( ) : (
<div className="h-full py-2 pt-3 flex justify-center items-center"> <div className="h-full py-2 pt-3 flex justify-center items-center">
<button <button
className="px-3 h-full border-gray-300 -ml-px" className="px-3 flex items-center h-full mb-1 border-gray-300 -ml-px border-t border-t-transparent"
onClick={onClick} onClick={onClick}
> >
<PlusIcon className="h-5" /> <PlusIcon className="h-5" />