Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 8747 | Rev 8903 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
8742 stevensc 1 
import React, { useState } from 'react'
4682 stevensc 2 
 
3 
const MenuItem = ({ item }) => {
4 
 
8742 stevensc 5 
    const [levelOneDisplay, setLevelOneDisplay] = useState(false)
6 
    const [levelTwoDisplay, setLevelTwoDisplay] = useState(false)
5212 stevensc 7 
    const path = window.location.pathname
5206 stevensc 8 
 
4682 stevensc 9 
    return (
8742 stevensc 10 
        <li className={(path.includes(item.route) || levelOneDisplay) ? "nav-item menu-is-opening menu-open" : "nav-item"}>
4682 stevensc 11 
            {
12 
                item.pages
8742 stevensc 13 
                    ?
8751 stevensc 14 
                    <a
15 
                        href='#'
8742 stevensc 16 
                        className="nav-link"
17 
                        onClick={() => setLevelOneDisplay(!levelOneDisplay)}
18 
                    >
19 
                        <i className={`nav-icon ${item.class}`}></i>
20 
                        <p>{item.label}</p>
21 
                        <i className="fa fa-angle-left menu_dropdown-arrow"></i>
8751 stevensc 22 
                    </a>
8742 stevensc 23 
                    :
24 
                    <a href={`/${item.route}`} className="nav-link">
25 
                        <i className={`nav-icon ${item.class}`}></i>
26 
                        <p>{item.label}</p>
27 
                    </a>
28 
            }
29 
            {
30 
                item.pages
4682 stevensc 31 
                &&
4784 stevensc 32 
                <ul className="nav nav-treeview">
4682 stevensc 33 
                    {
34 
                        item.pages.map((levelTwo) =>
8742 stevensc 35 
                            <li className={(path.includes(item.route) || levelTwoDisplay) ? "nav-item menu-is-opening menu-open" : "nav-item"}>
4682 stevensc 36 
                                {
37 
                                    levelTwo.pages
8742 stevensc 38 
                                        ?
8747 stevensc 39 
                                        <a
40 
                                            href='#'
8742 stevensc 41 
                                            className="nav-link"
8751 stevensc 42 
                                            onClick={() => setLevelTwoDisplay(!levelTwoDisplay)}
8742 stevensc 43 
                                        >
44 
                                            <i className="fa fa-circle nav-icon"></i>
45 
                                            <p>{levelTwo.label}</p>
46 
                                            <i className="fa fa-angle-left menu_dropdown-arrow"></i>
8747 stevensc 47 
                                        </a>
8742 stevensc 48 
                                        :
49 
                                        <a href={`/${levelTwo.route}`} className="nav-link">
50 
                                            <i className="fa fa-circle nav-icon"></i>
51 
                                            <p>{levelTwo.label}</p>
52 
                                        </a>
53 
 
54 
                                }
55 
                                {
56 
                                    levelTwo.pages
4682 stevensc 57 
                                    &&
4784 stevensc 58 
                                    <ul className="nav nav-treeview">
4682 stevensc 59 
                                        {
60 
                                            levelTwo.pages.map((levelThree) =>
4784 stevensc 61 
                                                <li className={`nav-item`}>
62 
                                                    <a href={`/${levelThree.route}`} className="nav-link">
63 
                                                        <i className="fa fa-circle-o nav-icon"></i>
4682 stevensc 64 
                                                        <p>{levelThree.label}</p>
65 
                                                    </a>
66 
                                                </li>)
67 
                                        }
68 
                                    </ul>
69 
                                }
70 
                            </li>)
71 
                    }
72 
                </ul>
73 
            }
74 
        </li>
75 
    )
76 
}
77 
 
78 
export default MenuItem