DEV Community

Ramu Narasinga
Ramu Narasinga

Posted on • Originally published at thinkthroo.com

warnOnce package in Refine source code.

In this article, we will review a package named warn-once. You will learn

  1. What is warn-once?

  2. Warn once usage in Refine source code

  3. warn-once code review

Image description

What is warn-once?

Print a warning exactly once during development. Suitable for deprecation warnings, warnings for missing setup etc.

Installation

Run the below command in your CLI to install this package

npm install warn-once
Enter fullscreen mode Exit fullscreen mode

Usage

warn-once accepts 2 parameters, one is the condition and the other one is the message that gets printed to the CLI exactly once. warn-once has some underlying checks to ensure this logs only once in the CLI.

const warnOnce = require('warn-once');

// ...

warnOnce(someCondition, 'This is a warning message');
Enter fullscreen mode Exit fullscreen mode

Note: This warning is only shown only when NODE_ENV is not set to “production”

Warn once usage in Refine source code

So I found this package in the Refine codebase in a file named hooks/breadcrumbs/index.ts

if (action && action !== "list") {
    const key = `actions.${action}`;
    const actionLabel = translate(key);
    if (typeof i18nProvider !== "undefined" && actionLabel === key) {
      warnOnce(
        true,
        `[useBreadcrumb]: Breadcrumb missing translate key for the "${action}" action. Please add "actions.${action}" key to your translation file.\nFor more information, see https://refine.dev/docs/api-reference/core/hooks/useBreadcrumb/#i18n-support`,
      );
      breadcrumbs.push({
        label: translate(
          `buttons.${action}`,
          textTransformers.humanize(action),
        ),
      });
    } else {
      breadcrumbs.push({
        label: translate(key, textTransformers.humanize(action)),
      });
    }
  }
Enter fullscreen mode Exit fullscreen mode

Image description

As you can see there are other files too, where this warn-once is used but with different parameters.

warn-once code review

index.js in the warn-once repository contains the below code

const DEV = process.env.NODE_ENV !== "production";

const warnings = new Set();

function warnOnce(condition, ...rest) {
  if (DEV && condition) {
    const key = rest.join(" ");

    if (warnings.has(key)) {
      return;
    }

    warnings.add(key);
    console.warn(...rest);
  }
}

module.exports = warnOnce;
Enter fullscreen mode Exit fullscreen mode

I also happened to create a Pull request with an example demonstrating the ability to pass n number of message strings as parameters.

Set is used and has check ensures the message gets logged only once.

About me:

Hey, my name is Ramu Narasinga. I study large open-source projects and create content about their codebase architecture and best practices, sharing it through articles, videos.

I am open to work on interesting projects. Send me an email at ramu.narasinga@gmail.com

My Github — https://github.com/ramu-narasinga

My website — https://ramunarasinga.com

My Youtube channel — https://www.youtube.com/@thinkthroo

Learning platform — https://thinkthroo.com

Codebase Architecture — https://app.thinkthroo.com/architecture

Best practices — https://app.thinkthroo.com/best-practices

Production-grade projects — https://app.thinkthroo.com/production-grade-projects

References:

  1. https://github.com/satya164/warn-once/pull/3

  2. https://github.com/refinedev/refine/blob/main/packages/core/src/hooks/breadcrumb/index.ts#L109

  3. https://www.npmjs.com/package/warn-once

  4. https://github.com/satya164/warn-once/blob/main/index.js

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Engage with a wealth of insights in this thoughtful article, valued within the supportive DEV Community. Coders of every background are welcome to join in and add to our collective wisdom.

A sincere "thank you" often brightens someone’s day. Share your gratitude in the comments below!

On DEV, the act of sharing knowledge eases our journey and fortifies our community ties. Found value in this? A quick thank you to the author can make a significant impact.

Okay