3 lines
56 KiB
HTML
3 lines
56 KiB
HTML
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta http-equiv="x-ua-compatible" content="ie=edge"/><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/><style data-href="/ilink-world/styles.2543ff947a193d7f33b1.css">@import url(https://fonts.googleapis.com/css?family=Inconsolata&display=swap);@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap);</style><meta name="generator" content="Gatsby 2.19.23"/><title data-rh="true">DrawerLateral | Ilink Documentation</title><meta data-rh="true" name="description" content="iLink Wolrd Documentation"/><meta data-rh="true" property="og:title" content="DrawerLateral"/><meta data-rh="true" property="og:description" content="iLink Wolrd Documentation"/><meta data-rh="true" property="og:type" content="website"/><meta data-rh="true" name="twitter:card" content="summary"/><meta data-rh="true" name="twitter:title" content="DrawerLateral"/><meta data-rh="true" name="twitter:description" content="iLink Wolrd Documentation"/><link as="script" rel="preload" href="/ilink-world/webpack-runtime-9e5853327598d6460c5f.js"/><link as="script" rel="preload" href="/ilink-world/styles-20f0d68269fa3624f1d7.js"/><link as="script" rel="preload" href="/ilink-world/app-20731433c17110cace49.js"/><link as="script" rel="preload" href="/ilink-world/commons-c1f2fd74d1b8d5629a84.js"/><link as="script" rel="preload" href="/ilink-world/component---screen-drawer-drawer-screen-mdx-af1231ad75b5d0b3c47e.js"/><link as="fetch" rel="preload" href="/ilink-world/page-data\screen\drawer-lateral\page-data.json" crossorigin="anonymous"/><link as="fetch" rel="preload" href="/ilink-world/page-data\app-data.json" crossorigin="anonymous"/></head><body><div id="___gatsby"><div style="outline:none" tabindex="-1" id="gatsby-focus-wrapper"><style data-emotion-css="1ouyflx">.css-1ouyflx{font-family:'Source Sans Pro',sans-serif;font-size:20px;font-weight:400;line-height:1.5;color:var(--theme-ui-colors-text,#2D3747);background-color:var(--theme-ui-colors-background,#FFFFFF);}</style><div class="css-1ouyflx"><style data-emotion-css="jrjj6h">.css-jrjj6h > div{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;}</style><style data-emotion-css="1ubpee3">.css-1ubpee3{min-height:100vh;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.css-1ubpee3 > div{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;}</style><style data-emotion-css="hbri28">.css-hbri28{box-sizing:border-box;min-width:0;min-height:100vh;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.css-hbri28 > div{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;}</style><div data-testid="layout" class="css-hbri28"><style data-emotion-css="1xva7m0">body{margin:0;padding:0;}.icon-link{display:none;}.with-overlay{overflow:hidden;}</style><style data-emotion-css="zf0iqh">.css-zf0iqh{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-height:100vh;}</style><style data-emotion-css="1tjxv7i">.css-1tjxv7i{-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-height:100vh;}</style><style data-emotion-css="238csb">.css-238csb{box-sizing:border-box;min-width:0;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;min-height:100vh;}</style><main class="css-238csb"><style data-emotion-css="18wmtq">.css-18wmtq{background-color:var(--theme-ui-colors-header-bg,#F5F6F7);position:relative;z-index:1;border-bottom:1px solid var(--theme-ui-colors-border,#CED4DE);}</style><div data-testid="header" class="css-18wmtq"><style data-emotion-css="zankq9">.css-zankq9{display:none;position:absolute;top:calc(100% + 15px);left:30px;}@media screen and (max-width:57.5em){.css-zankq9{display:block;}}</style><style data-emotion-css="1s0wdqz">.css-1s0wdqz{box-sizing:border-box;min-width:0;display:none;position:absolute;top:calc(100% + 15px);left:30px;}@media screen and (max-width:57.5em){.css-1s0wdqz{display:block;}}</style><div class="css-1s0wdqz"><style data-emotion-css="4019lz">.css-4019lz{padding:0;outline:none;background:transparent;border:none;color:var(--theme-ui-colors-header-text,#2D3747);opacity:0.5;cursor:pointer;}.css-4019lz:hover{cursor:pointer;}</style><button class="css-4019lz"><svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg></button></div><style data-emotion-css="z6jak6">.css-z6jak6{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding-left:32px;padding-right:32px;position:relative;height:80px;}</style><div class="css-z6jak6"><style data-emotion-css="xenp3v">.css-xenp3v{-webkit-letter-spacing:-0.02em;-moz-letter-spacing:-0.02em;-ms-letter-spacing:-0.02em;letter-spacing:-0.02em;font-weight:600;font-size:24px;}</style><style data-emotion-css="1abzlu">.css-1abzlu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-letter-spacing:-0.02em;-moz-letter-spacing:-0.02em;-ms-letter-spacing:-0.02em;letter-spacing:-0.02em;font-weight:600;font-size:24px;}</style><style data-emotion-css="ug0363">.css-ug0363{box-sizing:border-box;min-width:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-letter-spacing:-0.02em;-moz-letter-spacing:-0.02em;-ms-letter-spacing:-0.02em;letter-spacing:-0.02em;font-weight:600;font-size:24px;}</style><div data-testid="logo" class="css-ug0363"><style data-emotion-css="gyijir">.css-gyijir{font-weight:600;color:var(--theme-ui-colors-header-text,#2D3747);-webkit-text-decoration:none;text-decoration:none;}.css-gyijir:hover{color:var(--theme-ui-colors-primary,#0B5FFF);}</style><a class="css-gyijir" href="/ilink-world/">Ilink Documentation</a></div><style data-emotion-css="k008qs">.css-k008qs{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><style data-emotion-css="80zs6q">.css-80zs6q{box-sizing:border-box;min-width:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><div class="css-80zs6q"><style data-emotion-css="1is33jg">.css-1is33jg{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;outline:none;padding:12px;border:none;border-radius:9999px;background-color:var(--theme-ui-colors-header-button-bg,#0B5FFF);color:var(--theme-ui-colors-header-button-color,#FFFFFF);font-size:12px;font-weight:600;cursor:pointer;}</style><button class="css-1is33jg"><svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></button></div></div></div><style data-emotion-css="w2cmj1">.css-w2cmj1{padding-top:0;padding-bottom:0;-webkit-flex:1;-ms-flex:1;flex:1;display:grid;grid-template-columns:250px 1fr;min-height:100vh;}@media screen and (max-width:57.5em){.css-w2cmj1{display:block;}}</style><div class="css-w2cmj1"><style data-emotion-css="1tn7q1x">.css-1tn7q1x{z-index:999;position:fixed;top:81px;right:0;bottom:0;left:0;background:rgba(0,0,0,0.6);-webkit-transition:all .2s ease-out;transition:all .2s ease-out;visibility:hidden;opacity:0;}</style><style data-emotion-css="h4snl3">.css-h4snl3{box-sizing:border-box;min-width:0;z-index:999;position:fixed;top:81px;right:0;bottom:0;left:0;background:rgba(0,0,0,0.6);-webkit-transition:all .2s ease-out;transition:all .2s ease-out;visibility:hidden;opacity:0;}</style><div class="css-h4snl3"></div><style data-emotion-css="1ethd5x">.css-1ethd5x{padding-top:32px;padding-bottom:32px;padding-left:32px;padding-right:32px;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:-webkit-sticky;position:sticky;top:0;z-index:1;min-width:0;max-height:100vh;border-right:1px solid var(--theme-ui-colors-border,#CED4DE);overflow:auto;-webkit-overflow-scrolling:touch;background-color:var(--theme-ui-colors-sidebar-bg,#FFFFFF);}@media screen and (max-width:57.5em){.css-1ethd5x{z-index:9999;display:block;position:fixed;top:81px;left:0;bottom:0;width:256px;padding-left:32px;padding-right:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);-webkit-transition:-webkit-transform .2s ease-out;-webkit-transition:transform .2s ease-out;transition:transform .2s ease-out;-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);}}</style><style data-emotion-css="1li9yso">.css-1li9yso{box-sizing:border-box;min-width:0;padding-top:32px;padding-bottom:32px;padding-left:32px;padding-right:32px;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:-webkit-sticky;position:sticky;top:0;z-index:1;min-width:0;max-height:100vh;border-right:1px solid var(--theme-ui-colors-border,#CED4DE);overflow:auto;-webkit-overflow-scrolling:touch;background-color:var(--theme-ui-colors-sidebar-bg,#FFFFFF);}@media screen and (max-width:57.5em){.css-1li9yso{z-index:9999;display:block;position:fixed;top:81px;left:0;bottom:0;width:256px;padding-left:32px;padding-right:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);-webkit-transition:-webkit-transform .2s ease-out;-webkit-transition:transform .2s ease-out;transition:transform .2s ease-out;-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);}}</style><div data-testid="sidebar" class="css-1li9yso"><style data-emotion-css="lcm9hh">.css-lcm9hh{margin-bottom:16px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div data-testid="nav-search" class="css-lcm9hh"><style data-emotion-css="1mo6uhh">.css-1mo6uhh{color:var(--theme-ui-colors-border,#CED4DE);margin-right:8px;}</style><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="css-1mo6uhh"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg><style data-emotion-css="1bbueiu">.css-1bbueiu{outline:none;background:none;border:none;color:var(--theme-ui-colors-text,#2D3747);font-size:14px;}</style><input placeholder="Type to search..." value="" class="css-1bbueiu"/></div><style data-emotion-css="1rqvyud">.css-1rqvyud{margin-top:8px;margin-bottom:8px;display:block;color:var(--theme-ui-colors-sidebar-navGroup,#2D3747);-webkit-text-decoration:none;text-decoration:none;font-size:16px;}.css-1rqvyud.active{color:var(--theme-ui-colors-sidebar-navLinkActive,#0B5FFF);}</style><a class="css-1rqvyud" href="/ilink-world/ilink-world">Accueil</a><style data-emotion-css="1ebprri">.css-1ebprri{margin-top:16px;margin-bottom:16px;}</style><div data-testid="nav-group" class="css-1ebprri"><style data-emotion-css="1c8kbwa">.css-1c8kbwa{margin-bottom:4px;font-size:16px;font-weight:500;color:var(--theme-ui-colors-sidebar-navGroup,#2D3747);cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}</style><div class="css-1c8kbwa">Database<style data-emotion-css="cu2sly">.css-cu2sly{margin-left:4px;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-align-self:baseline;-ms-flex-item-align:baseline;align-self:baseline;-webkit-transform:rotateX(0deg);-ms-transform:rotateX(0deg);transform:rotateX(0deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transition:-webkit-transform .3s ease-in-out;-webkit-transition:transform .3s ease-in-out;transition:transform .3s ease-in-out;}</style><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="css-cu2sly"><polyline points="6 9 12 15 18 9"></polyline></svg></div><style data-emotion-css="1isemmb">.css-1isemmb{margin-left:8px;}</style><div data-testid="nav-group-links" class="css-1isemmb"></div></div><div data-testid="nav-group" class="css-1ebprri"><div class="css-1c8kbwa">Screen<style data-emotion-css="1scp5x8">.css-1scp5x8{margin-left:4px;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-align-self:baseline;-ms-flex-item-align:baseline;align-self:baseline;-webkit-transform:rotateX(180deg);-ms-transform:rotateX(180deg);transform:rotateX(180deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transition:-webkit-transform .3s ease-in-out;-webkit-transition:transform .3s ease-in-out;transition:transform .3s ease-in-out;}</style><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="css-1scp5x8"><polyline points="6 9 12 15 18 9"></polyline></svg></div><div data-testid="nav-group-links" class="css-1isemmb"><a class="css-1rqvyud" href="/ilink-world/screen/add-network-screen">AddNetworkScreen</a><a class="css-1rqvyud" href="/ilink-world/screen/configuration-screen">ConfigurationScreen</a><a aria-current="page" class="css-1rqvyud active" href="/ilink-world/screen/drawer-lateral">DrawerLateral</a><style data-emotion-css="1ooej63">.css-1ooej63{margin-top:8px;margin-bottom:8px;display:block;color:var(--theme-ui-colors-sidebar-tocLink,#67788a);-webkit-text-decoration:none;text-decoration:none;font-size:14px;margin-left:16px;position:relative;}.css-1ooej63.active{color:var(--theme-ui-colors-sidebar-tocLinkActive,#1D2330);}.css-1ooej63.active::before{content:"";position:absolute;display:block;top:2px;left:-8px;height:1rem;background-color:var(--theme-ui-colors-primary,#0B5FFF);-webkit-transition:width 200ms ease 0s;transition:width 200ms ease 0s;width:2px;border-radius:1px;}</style><a class=" css-1ooej63" href="/ilink-world/screen/drawer-lateral#initialisation">Initialisation</a><a class=" css-1ooej63" href="/ilink-world/screen/drawer-lateral#menu-utilisateur">Menu Utilisateur</a><a class=" css-1ooej63" href="/ilink-world/screen/drawer-lateral#menu-utilisateur-géolocalisé-superviseur-et-hyperviseur">Menu Utilisateur Géolocalisé, Superviseur et Hyperviseur</a><a class=" css-1ooej63" href="/ilink-world/screen/drawer-lateral#déconnexion-de-lutilisateur">Déconnexion de l'utilisateur</a><a class="css-1rqvyud" href="/ilink-world/screen/history-screen">HistoryScreen</a><a class="css-1rqvyud" href="/ilink-world/screen/intersticiel-ads-screen">IntersticielAdsScreen</a><a class="css-1rqvyud" href="/ilink-world/screen/user-account">UserAccount</a></div></div><div data-testid="nav-group" class="css-1ebprri"><div class="css-1c8kbwa">WebServices<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="css-cu2sly"><polyline points="6 9 12 15 18 9"></polyline></svg></div><div data-testid="nav-group-links" class="css-1isemmb"></div></div></div><style data-emotion-css="1w3d2mg">.css-1w3d2mg{background-color:var(--theme-ui-colors-background,#FFFFFF);position:relative;max-width:1280px;padding-top:48px;padding-bottom:48px;padding-left:32px;padding-right:32px;padding:32px;}@media screen and (max-width:57.5em){.css-1w3d2mg{padding-top:48px;padding-bottom:32px;padding-left:32px;padding-right:32px;}}</style><style data-emotion-css="kjtkh5">.css-kjtkh5{width:100%;min-width:0;max-width:1280px;margin-left:auto;margin-right:auto;padding:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);position:relative;max-width:1280px;padding-top:48px;padding-bottom:48px;padding-left:32px;padding-right:32px;padding:32px;}@media screen and (max-width:57.5em){.css-kjtkh5{padding-top:48px;padding-bottom:32px;padding-left:32px;padding-right:32px;}}</style><style data-emotion-css="1307vk3">.css-1307vk3{box-sizing:border-box;min-width:0;width:100%;min-width:0;max-width:1280px;margin-left:auto;margin-right:auto;padding:32px;background-color:var(--theme-ui-colors-background,#FFFFFF);position:relative;max-width:1280px;padding-top:48px;padding-bottom:48px;padding-left:32px;padding-right:32px;padding:32px;}@media screen and (max-width:57.5em){.css-1307vk3{padding-top:48px;padding-bottom:32px;padding-left:32px;padding-right:32px;}}</style><div data-testid="main-container" class="css-1307vk3"><style data-emotion-css="1vci3bl">.css-1vci3bl{padding:0;margin:0;margin-bottom:16px;font-size:48px;font-family:'Source Sans Pro',sans-serif;line-height:1.125;font-weight:700;}</style><h1 id="drawerlateral" class="css-1vci3bl">DrawerLateral</h1><style data-emotion-css="1ftn47p">.css-1ftn47p{padding:0;margin:0;margin-bottom:16px;}</style><p class="css-1ftn47p">Le menu latéral de l'application ou encore Drawer est matérialiser par le fichier <style data-emotion-css="1iv9jyz">.css-1iv9jyz{color:var(--theme-ui-colors-primary,#0B5FFF);-webkit-text-decoration:none;text-decoration:none;}.css-1iv9jyz:hover{color:secondary;-webkit-text-decoration:underline;text-decoration:underline;}</style><a href="https://dev.ilink-app.com/administrateur/iLink-Wolrd/src/branch/master/screens/optionMenu/OptionsMenu.js" class="css-1iv9jyz">OptionsMenu.js</a>.
|
|
Elle contient l'ensemble des options de menu disponibles au sein de l'application iLink World.</p><br/><p class="css-1ftn47p">Elle distingue notamment les types d'utilisateurs, et affiche un menu en fonciton du type de comtpe de l'utilisateur connecté.</p><p class="css-1ftn47p">⚠️ Des composants plus récents existent</p><p class="css-1ftn47p">Il des composants plus récents, pour plus d'ergonomie et de flexibilité notamment <a href="https://reactnavigation.org/docs/drawer-based-navigation/" class="css-1iv9jyz">Drawer-Navigation</a></p><h2 id="initialisation"><style data-emotion-css="1r0pe6c">.css-1r0pe6c{color:inherit;-webkit-text-decoration:none;text-decoration:none;}.css-1r0pe6c:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a href="#initialisation" class="css-1r0pe6c">Initialisation</a></h2><p class="css-1ftn47p">Après l'étape de connexion de l'utilisateur, une interface lui ai affiché en fonction du type de son compte.</p><br/><h2 id="menu-utilisateur"><a href="#menu-utilisateur" class="css-1r0pe6c">Menu Utilisateur</a></h2><style data-emotion-css="2abk98">.css-2abk98{padding:0;margin:0;margin-bottom:16px;border:0;border-bottom:1px solid var(--theme-ui-colors-border,#CED4DE);margin-top:-1px;}</style><hr class="css-2abk98"/><p class="css-1ftn47p">Dans le cas d'un compte de type 'Utilisateur', le menu par défaut lui affiché ceci par la fonction suivante:</p><div><style data-emotion-css="1h0sj8d">.css-1h0sj8d{padding:16px;margin:0;margin-bottom:32px;font-size:85%;margin-top:32px;text-align:left;font-family:Inconsolata;border-radius:4px;}.css-1h0sj8d dark{[object Object];}.css-1h0sj8d light{[object Object];}</style><pre class="language-javascript prism-code language-javascript css-1h0sj8d" style="font-family:Inconsolata;color:#393A34;background-color:#f6f8fa;overflow-x:auto" data-testid="code"><div class="token-line" style="font-family:Inconsolata;color:#393A34"><style data-emotion-css="1baulvz">.css-1baulvz{display:inline-block;}</style><span class="token function css-1baulvz" style="color:#d73a49">getUserMenu</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token keyword css-1baulvz" style="color:#00009f">return</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">[</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'MAP'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">0</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">0</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-map'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">true</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'MY_ACCOUNT'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">1</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">1</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-person'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'NOTIFICATIONS'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">3</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">3</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-notifications'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'CONFIGURATIONS'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">4</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-settings'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token punctuation css-1baulvz" style="color:#393A34">]</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span></div></pre></div><p class="css-1ftn47p">qui renvoie les quatres principaux menus dédiés à un utilisateur. Les clés 'icon' et 'active' permettent respectivement d'afficher l'icône associé au menu et de le rendre actif si l'on est bien positionné sur lui.</p><p class="css-1ftn47p">⚠️ NB: la fonction I18n permet d'effectuer la traduction du texte en se basant sur une clé auquel correspond un texte. Celà est abordé plus en détail dans la vue <a href="/ilink-world/screen/configuration-screen#la-biblioth%C3%A8que-react-native-i18n" class="css-1iv9jyz">ConfigurationScreen</a>.</p><h2 id="menu-utilisateur-géolocalisé-superviseur-et-hyperviseur"><a href="#menu-utilisateur-géolocalisé-superviseur-et-hyperviseur" class="css-1r0pe6c">Menu Utilisateur Géolocalisé, Superviseur et Hyperviseur</a></h2><hr class="css-2abk98"/><p class="css-1ftn47p">Dans le cas d'un compte de type 'Utilisateur Géolocalisé', 'Superviseur' et 'Hyperviseur', des options supplémentaires sont affichés ainsi qu'il suit:</p><div><pre class="language-javascript prism-code language-javascript css-1h0sj8d" style="font-family:Inconsolata;color:#393A34;background-color:#f6f8fa;overflow-x:auto" data-testid="code"><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token function css-1baulvz" style="color:#d73a49">getGeolocatedUserMenu</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token keyword css-1baulvz" style="color:#00009f">return</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">[</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'MAP'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">0</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">0</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-map'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">true</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'MY_ACCOUNT'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">1</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">1</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-person'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'CREDIT_MANAGE'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">2</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">2</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-card'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'ADD_NETWORK'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">11</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">11</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-people'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'CHANGE_INFORMATION'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">13</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">13</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-person'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'NOTIFICATIONS'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">3</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> key</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">3</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-notifications'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"> title</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">I18n</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">t</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">'CONFIGURATIONS'</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> id</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token number css-1baulvz" style="color:#36acaa">4</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> icon</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token string css-1baulvz" style="color:#e3116c">'md-settings'</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> active</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">false</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token punctuation css-1baulvz" style="color:#393A34">]</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span></div></pre></div><hr class="css-2abk98"/><h2 id="déconnexion-de-lutilisateur"><a href="#déconnexion-de-lutilisateur" class="css-1r0pe6c">Déconnexion de l'utilisateur</a></h2><p class="css-1ftn47p">Le menu Déconnexion permet à un utilisateur connecté de déconnecter son compte et par la même occasion d'être redigiré vers l'interface de connexion de l'application.
|
|
Ceci se fait premièrement par l'affichage d'une boîte de dialogue demandant à l'utilisateur de confirmer sa déconnexion, une fois que celà est fait un évenement est dispatché au sein de l'application ce qui permet au fonction qui écoute cette évenement de se déclencher.</p><div><pre class="language-javascript prism-code language-javascript css-1h0sj8d" style="font-family:Inconsolata;color:#393A34;background-color:#f6f8fa;overflow-x:auto" data-testid="code"><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token function css-1baulvz" style="color:#d73a49">disconnect</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">IlinkEmitter</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">emit</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token string css-1baulvz" style="color:#e3116c">"userdisconnect"</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token punctuation css-1baulvz" style="color:#393A34">;</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token maybe-class-name css-1baulvz">Navigation</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token method function property-access css-1baulvz" style="color:#d73a49">setStackRoot</span><span class="token punctuation css-1baulvz" style="color:#393A34">(</span><span class="token plain css-1baulvz">route</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token property-access css-1baulvz">stackRoot</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> component</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">{</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> name</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> route</span><span class="token punctuation css-1baulvz" style="color:#393A34">.</span><span class="token property-access css-1baulvz">login</span><span class="token punctuation css-1baulvz" style="color:#393A34">,</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> animated</span><span class="token punctuation css-1baulvz" style="color:#393A34">:</span><span class="token plain css-1baulvz"> </span><span class="token boolean css-1baulvz" style="color:#36acaa">true</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span><span class="token plain css-1baulvz"></span></div><div class="token-line" style="font-family:Inconsolata;color:#393A34"><span class="token plain css-1baulvz"> </span><span class="token punctuation css-1baulvz" style="color:#393A34">}</span><span class="token punctuation css-1baulvz" style="color:#393A34">)</span></div></pre></div><p class="css-1ftn47p">⚠️ Cette manière de procéder est obsolète</p><p class="css-1ftn47p"><em class="css-0">Aujourd'hui la bibliothèque <a href="https://redux.js.org/" class="css-1iv9jyz">redux</a> permet une meilleur gestion du state global de l'application.</em></p></div></div></main></div></div></div></div><script id="gatsby-script-loader">/*<![CDATA[*/window.pagePath="/screen/drawer-lateral";/*]]>*/</script><script id="gatsby-chunk-mapping">/*<![CDATA[*/window.___chunkMapping={"app":["/app-20731433c17110cace49.js"],"component---index-mdx":["/component---index-mdx-f764d3af49a6f250d759.js"],"component---database-database-mdx":["/component---database-database-mdx-6845053e94a541ec5bc8.js"],"component---database-db-config-mdx":["/component---database-db-config-mdx-283f409520d2025d9d9d.js"],"component---webservice-webservice-mdx":["/component---webservice-webservice-mdx-89fbea1b9fa53dc1e9c0.js"],"component---screen-screen-mdx":["/component---screen-screen-mdx-ddc6e4bf036e12d21a5f.js"],"component---webservice-auth-api-mdx":["/component---webservice-auth-api-mdx-3e47ffc7a6f1b6cf50d5.js"],"component---screen-account-add-network-mdx":["/component---screen-account-add-network-mdx-d0837e8a2333a8290e79.js"],"component---screen-account-user-account-mdx":["/component---screen-account-user-account-mdx-d63ebe786c75ecf11007.js"],"component---screen-configuration-configurations-mdx":["/component---screen-configuration-configurations-mdx-17e98af3f6cb8f3306b0.js"],"component---screen-ads-intersticiel-ads-screen-mdx":["/component---screen-ads-intersticiel-ads-screen-mdx-60bca76dfbd054adfcc7.js"],"component---screen-drawer-drawer-screen-mdx":["/component---screen-drawer-drawer-screen-mdx-af1231ad75b5d0b3c47e.js"],"component---screen-history-history-screen-mdx":["/component---screen-history-history-screen-mdx-439e3c4d3fffe35eded3.js"],"component---src-pages-404-js":["/component---src-pages-404-js-76c60c8f67c626200eee.js"]};/*]]>*/</script><script src="/ilink-world/component---screen-drawer-drawer-screen-mdx-af1231ad75b5d0b3c47e.js" async=""></script><script src="/ilink-world/commons-c1f2fd74d1b8d5629a84.js" async=""></script><script src="/ilink-world/app-20731433c17110cace49.js" async=""></script><script src="/ilink-world/styles-20f0d68269fa3624f1d7.js" async=""></script><script src="/ilink-world/webpack-runtime-9e5853327598d6460c5f.js" async=""></script></body></html> |