title: How to allow location permission and revoke permission using same button in react?
body: <p>Hi i am new to programming.</p>
  
  <p>i want to achieve the following,</p>
  
  <p>on clicking a button it should display a native browser popup asking user for location permission. accepting the permission should display the button in green. and in case the user wants to disallow location sharing then he uses the same button to do so.</p>
  
  <p>What i have tried so far?</p>
  
  <p>Below is the code,</p>
  
  <pre><code>class location extends react.purecomponent {
      state = {
          active: false,
      };
  
      componentdidMount() {
          navigator.permissions.query({name:'geolocation'}).then((result) =&gt; 
          {
              if (result.state === 'granted') {
                  this.setState({active: true});
              } else if (result.state === 'prompt') {
                  this.setState({active: false});
              } else if (result.state === 'denied') {
                  this.setState({active: false});
              }
          });
      }
  
      show_position = (position) =&gt; {
          return position.coords.latitude;
      };
  
      handle_my_location = () =&gt; {
          if (navigator.geolocation) {
              navigator.geolocation.getCurrentPosition(this.show_position, 
              null);
          } else {
              console.log("unavailable");
          }
      };
      render = () =&gt; {
          return (
              &lt;button type="button" className={'icon' + (this.state.active ? '   active': '')} onClick={this.handle_my_location}}&gt;
                  &lt;Svg width="16"/&gt;
              &lt;/button&gt;
          );
      };
  }
  </code></pre>
  
  <p>Now the question is how can i use the same button to revoke permissions (deny location sharing) meaning in the handle_my_location method how can i check if user wants to revoke or allow location sharing. If revoking then should call</p>
  
  <pre><code>navigator.permissions.revoke({name:'geolocation'});
  </code></pre>
  
  <p>To explain the usecase better.
  consider user logins to the application for the first time. clicks the button. it displays location sharing popup. user allows location sharing. this button is active. now if user wants to revoke permissions (meaning disallow location sharing) clicks same button then how do i revoke permissions in handle_my_location method.</p>
  
  <p>could someone help me with this. thanks.</p>