npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@bigbinary/neeto-access-control-frontend

v1.3.3

Published

Neeto access control

Downloads

1,594

Readme

neeto-access-control-nano

The neeto-access-control-nano manages access control across neeto products. The nano exports the @bigbinary/neeto-access-control-frontend NPM package and neeto-access-control-engine Rails engine for development.

Contents

  1. Development with Host Application
  2. Instructions for Publishing
  3. Releasing beta versions

Development with Host Application

Engine

The engine is used to manage access control across neeto products.

Installation

  1. Add the gem in Gemfile

      source "NEETO_GEM_SERVER_URL" do
        # ..existing gems
    
        gem "neeto-access-control-engine"
      end
  2. Install the gem

      bundle install
  3. Add required migrations in the db/migrate folder. Run the following commands to copy the migrations from the engine to the host application. Ex: neetoForm

      bundle exec rails neeto_access_control_engine:install:migrations
      bundle exec rails db:migrate
  4. Add this line to your application's config/routes.rb file:

      mount NeetoAccessControlEngine::Engine => "/secure"
  5. Add has_one association to the model you want to add the access control configuration. For Example - The organization only needs single access control.

      class Organization < ApplicationRecord
        has_one :access_control_configuration, as: :owner, class_name: "NeetoAccessControlEngine::Configuration", dependent: :destroy
      end
  6. Your controller must include the concern and access_control_configuration method.

      class PublicController < ApplicationController
        .
        .
        include NeetoAccessControlEngine::Authenticate
        .
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
      end
  7. Add overrides for the following files:

  • 7.1. google_controller_override.rb

      NeetoAccessControlEngine::GoogleController.class_eval do
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
      end
  • 7.2. invitations_controller_override.rb (Optional)

    • Methods
      • access_control_configuration
      • after_invitations_created

    If host app doesn't have an override method for the controller, then neeto_access_control_configuration_id parameter must be included in the request params.

      NeetoAccessControlEngine::Api::V1::Configurations::InvitationsController.class_eval do
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
    
          # after_action callback, called after invitations are created.
          # Use to send invitation emails or perform any post-invitation tasks.
          def after_invitations_created
            # @invited_emails is loaded in engine
            return if @invited_emails.blank?
    
            EmailInvitationsJob.perform_async(@invited_emails, current_user.id)
          end
      end
  • 7.3. guest_sessions_controller_override.rb

      NeetoAccessControlEngine::GuestSessionsController.class_eval do
        private
    
          def access_control_configuration
            @_access_control_configuration ||= @organization.access_control_configuration
          end
      end
  • 7.4. configurations_controller_override.rb

      NeetoAccessControlEngine::Api::V1::ConfigurationsController.class_eval do
    
        private
    
          def owner
            @organization
          end
      end
  1. Add Google OAuth support
  • 8.1. Create Google OAuth account Watch the demo video for step-by-step instructions on creating a Google OAuth account. Add the authorised redirect URI: https://connect.neetokb.net/secure/google_oauth2/callback

  • 8.2. Set the env variables Add the following secret values to config/secrets.yml.

    google:
      client_id: <%= ENV['GOOGLE_OAUTH_CLIENT_ID'] %>
      client_secret: <%= ENV['GOOGLE_OAUTH_CLIENT_SECRET'] %>

Frontend package

Installation

  1. Install the latest neeto-access-control-frontend package using the below command:
      yarn add @bigbinary/neeto-access-control-frontend

Components

1. Configuration (source code)

Props

  • ownerId: To specify the ID of the instance of the model. The ID is used to fetch and update access control configuration.
  • ownerType: Type of the model.
  • onReset: Callback function that is triggered when the reset button is clicked.
  • onSuccess: Callback function that is triggered when the configuration is successfully updated.
  • handleCancel: Callback function that is triggered when the cancel button is clicked.
  • invitationsTableExtraColumnsData: Prop to add column data for invitations table. This will override the existing column if the key is already present. Refer Column data
  • onConfigurationChangedToInviteOnly: Callback function that is triggered when configuration is changed to invited. Default: noop.
  • headerProps: Props passed to the Header component from neetoMolecules.
  • hideAddEmailsFromInvitationPane: Prop to hide the add emails form from invitation pane. Default: false.
  • className: Additional classes to be added to the form.
  • onDestroyInvitationsSuccess: Callback function that is triggered when the invitations are successfully destroyed.

2. Invitations Object

The Invitations object provides access to invitation-related components, hooks, and constants.

Components

InvitationsPane (source code)

Props

Check source code for default values

  • onClose: Callback function that is triggered when the close button is clicked.
  • isOpen: Prop for pane, will reflect state of the pane.
  • extraColumnsData: Prop to add column data for invitations table. This will override the existing column if the key is already present. Refer Column data
  • ownerId: To specify the ID of the instance of the model. The ID is used to fetch and update access control configuration.
  • ownerType: Type of the model.
  • hideAddEmailsForm: Prop to hide the add emails form from invitation pane.
  • configurationId: Prop to specify the ID of the instance of the model. The ID is used to load access control configuration. NOTE: If this prop is not passed, make sure invitations_controller_override.rb is added with access_control_configuration method as mentioned above in adding overrides section.
  • onDestroyInvitationsSuccess: Callback function that is triggered when the invitations are successfully destroyed.

Hooks

Constants

  • INVITATIONS_QUERY_KEY: For react query cache of invitations

Invitations object usage

/* Required imports */
import { Invitations } from "@bigbinary/neeto-access-control-frontend";

const { InvitationsPane, useBulkCreateInvitations, INVITATIONS_QUERY_KEY } =
  Invitations;

const MyComponent = () => {
  const [showInviationsPane, setShowInviationsPane] = useState(false);
  const [emails, setEmails] = useState("");

  const { mutateAsync: addEmails } = useBulkCreateInvitations({
    configurationId: null,
  });

  const queryClient = useQueryClient();

  const addTestEmails = async () => {
    const payload = { emails: emails.split(",") };
    await addEmails(payload);
    setEmails("");
    queryClient.invalidateQueries({
      queryKey: [INVITATIONS_QUERY_KEY],
    });
  };

  return (
    <div className="space-4 p-5">
      <Input
        label="Email"
        value={emails}
        onChange={e => setEmails(e.target.value)}
      />
      <Button label="Add test email " onClick={addTestEmails} />
      <Button
        label="Open Invitation pane"
        onClick={() => setShowInviationsPane(true)}
      />
      <InvitationsPane
        hideAddEmailsForm
        isOpen={showInviationsPane}
        onClose={() => setShowInviationsPane(false)}
      />
    </div>
  );
};

Usage

This is an example usage in neetoKB

import React from "react";

import { Configuration } from "@bigbinary/neeto-access-control-frontend";

import { HELP_SECURITY_DOC_URL } from "src/constants/urls";

import { buildDefaultBreadcrumbs } from "./utils";

const AccessControl = () => {
  return (
    <Configuration
      className="mx-auto max-w-3xl md:px-0 lg:px-6"
      handleCancel={() => {}}
      headerProps={{
        title: "Access control",
        description: "Access control description",
        helpLink: HELP_SECURITY_DOC_URL,
        breadcrumbs: buildDefaultBreadcrumbs({
          title: "Access control",
        }),
      }}
    />
  );
};

export default AccessControl;

Hooks

1. useShowConfiguration

This is a React Query hook for fetching access control configuration of specified owner.

Arguments

  • ownerId: To specify the ID of the model instance. This ID will be used to fetch access control configuration.
  • ownerType: Type of the model.

Usage

const {
  data: { configuration },
} = useShowConfiguration({ ownerId, ownerType });

Customize option labels in the host application with translations

To customize option labels for authentication, you can set the translations from the host application. To set the translations from the host application:

  • Open the en.json file.
  • Add translations for the auth option labels under the neetoAccessControl.auth namespace. For Example:
    {
      "neetoAccessControl": {
        "auth": {
          "no": "No auth label",
          "basic": "Basic auth label",
          "email": "Email auth label"
          "session": "Session auth label"
        }
      }
    }

Instructions for Publishing

Consult the building and releasing packages guide for details on how to publish.

Releasing beta versions

  • Push the changes to a target branch for releasing the beta version.
  • Update the package version to {latest-version}-beta (if 1.2.34 is the current latest version, it will be 1.2.34-beta) in the target branch for beta release.
  • Draft a new release from the repo with the target branch.
  • Add a new tag and title in the format: version prefixed with v, eg: v1.2.34-beta.
  • Generate release notes.
  • Set the release as a pre-release and publish the release.

If we are releasing a beta version of a product, we have to inform the compliance team as well to avoid overwriting the version with the latest version on the next compliance release.