Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 8751 | Rev 8909 | 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
                    >
18
                        <i className={`nav-icon ${item.class}`}></i>
19
                        <p>{item.label}</p>
20
                        <i className="fa fa-angle-left menu_dropdown-arrow"></i>
8751 stevensc 21
                    </a>
8742 stevensc 22
                    :
23
                    <a href={`/${item.route}`} className="nav-link">
24
                        <i className={`nav-icon ${item.class}`}></i>
25
                        <p>{item.label}</p>
26
                    </a>
27
            }
28
            {
29
                item.pages
4682 stevensc 30
                &&
4784 stevensc 31
                <ul className="nav nav-treeview">
4682 stevensc 32
                    {
33
                        item.pages.map((levelTwo) =>
8742 stevensc 34
                            <li className={(path.includes(item.route) || levelTwoDisplay) ? "nav-item menu-is-opening menu-open" : "nav-item"}>
4682 stevensc 35
                                {
36
                                    levelTwo.pages
8742 stevensc 37
                                        ?
8747 stevensc 38
                                        <a
39
                                            href='#'
8742 stevensc 40
                                            className="nav-link"
8751 stevensc 41
                                            onClick={() => setLevelTwoDisplay(!levelTwoDisplay)}
8742 stevensc 42
                                        >
43
                                            <i className="fa fa-circle nav-icon"></i>
44
                                            <p>{levelTwo.label}</p>
45
                                            <i className="fa fa-angle-left menu_dropdown-arrow"></i>
8747 stevensc 46
                                        </a>
8742 stevensc 47
                                        :
48
                                        <a href={`/${levelTwo.route}`} className="nav-link">
49
                                            <i className="fa fa-circle nav-icon"></i>
50
                                            <p>{levelTwo.label}</p>
51
                                        </a>
52
 
53
                                }
54
                                {
55
                                    levelTwo.pages
4682 stevensc 56
                                    &&
4784 stevensc 57
                                    <ul className="nav nav-treeview">
4682 stevensc 58
                                        {
59
                                            levelTwo.pages.map((levelThree) =>
4784 stevensc 60
                                                <li className={`nav-item`}>
61
                                                    <a href={`/${levelThree.route}`} className="nav-link">
62
                                                        <i className="fa fa-circle-o nav-icon"></i>
4682 stevensc 63
                                                        <p>{levelThree.label}</p>
64
                                                    </a>
65
                                                </li>)
66
                                        }
67
                                    </ul>
68
                                }
69
                            </li>)
70
                    }
71
                </ul>
72
            }
73
        </li>
74
    )
75
}
76
 
77
export default MenuItem