broad-amaranth•2mo ago

humanizeThe function converts the resource name to a more human-readable format. The default value

is this still used humanize The function converts the resource name to a more human-readable format. The default value uses the humanize-string library.

11 Replies

kapa.ai•2mo ago

Hi @Joe Gaffney. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Yes, the humanize function in Refine is used to convert the resource name to a more human-readable format. The default value for this function uses the humanize-string library. Here is the relevant information from the knowledge sources:

The function converts the resource name to a more human-readable format. The default value uses the humanize-string (https://www.npmjs.com/package/humanize-string) library.

For more details, you can refer to the Refine documentation on textTransformers (https://refine.dev/docs/core/refine-component/#texttransformers). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•2mo ago

<@422289470487003153> kapa.ai is still learning and improving, please let us know how it did by reacting below

broad-amaranth•2mo ago

@kapa.ai are you sure as cant see this in the pakage json how would i call this directly

kapa.ai•2mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- Yes, you can directly use the humanize-string library in your project if you want to call it directly. Here’s how you can add it to your project and use it: 1. Install the humanize-string library: You need to add the humanize-string library to your project's dependencies. You can do this using npm, pnpm, or yarn.

   npm install humanize-string

   npm install humanize-string

   pnpm add humanize-string

   pnpm add humanize-string

   yarn add humanize-string

   yarn add humanize-string

2. Use the humanize-string library in your code: Once installed, you can import and use the humanize-string function in your project. Here’s an example:

   import humanizeString from 'humanize-string';

   const resourceName = 'posts';
   const humanizedName = humanizeString(resourceName);

   console.log(humanizedName); // Outputs: "Posts"

   import humanizeString from 'humanize-string';

   const resourceName = 'posts';
   const humanizedName = humanizeString(resourceName);

   console.log(humanizedName); // Outputs: "Posts"

If you want to customize the humanize function within Refine, you can do so by setting the textTransformers option as shown below:

import humanizeString from 'humanize-string';

const App = () => (
  <Refine
    // ...
    options={{
      textTransformers: {
        humanize: (text) => humanizeString(text),
        plural: (text) => text,  // Customize as needed
        singular: (text) => text,  // Customize as needed
      },
    }}
  />
);

import humanizeString from 'humanize-string';

const App = () => (
  <Refine
    // ...
    options={{
      textTransformers: {
        humanize: (text) => humanizeString(text),
        plural: (text) => text,  // Customize as needed
        singular: (text) => text,  // Customize as needed
      },
    }}
  />
);

kapa.ai•2mo ago

<@422289470487003153> kapa.ai is still learning and improving, please let us know how it did by reacting below

broad-amaranth•2mo ago

@kapa.ai see here is says https://refine.dev/docs/core/refine-component/#humanize humanize The function converts the resource name to a more human-readable format. The default value uses the humanize-string library. But this not a in the dependancies of refine as far as i can see

| Refine

`` component is the entry point of a Refine app. It is where the highest level of configuration of the app occurs.

kapa.ai•2mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- You are correct that the humanize-string library is not listed in the dependencies of Refine in the provided package.json extracts. However, the documentation does state that the default value for the humanize function uses the humanize-string library. If you want to use the humanize-string library directly in your project, you can add it as a dependency yourself. Here’s how you can do it: 1. Install the humanize-string library: You can add the humanize-string library to your project's dependencies using npm, pnpm, or yarn.

   npm install humanize-string

   npm install humanize-string

   pnpm add humanize-string

   pnpm add humanize-string

   yarn add humanize-string

   yarn add humanize-string

2. Use the humanize-string library in your code: Once installed, you can import and use the humanize-string function in your project. Here’s an example:

   import humanizeString from 'humanize-string';

   const resourceName = 'posts';
   const humanizedName = humanizeString(resourceName);

   console.log(humanizedName); // Outputs: "Posts"

   import humanizeString from 'humanize-string';

   const resourceName = 'posts';
   const humanizedName = humanizeString(resourceName);

   console.log(humanizedName); // Outputs: "Posts"

3. Customize the humanize function in Refine: If you want to customize the humanize function within Refine, you can do so by setting the textTransformers option as shown below:

   import humanizeString from 'humanize-string';

   const App = () => (
     <Refine
       // ...
       options={{
         textTransformers: {
           humanize: (text) => humanizeString(text),
           plural: (text) => text,  // Customize as needed
           singular: (text) => text,  // Customize as needed
         },
       }}
     />
   );

   import humanizeString from 'humanize-string';

   const App = () => (
     <Refine
       // ...
       options={{
         textTransformers: {
           humanize: (text) => humanizeString(text),
           plural: (text) => text,  // Customize as needed
           singular: (text) => text,  // Customize as needed
         },
       }}
     />
   );

kapa.ai•2mo ago

<@422289470487003153> kapa.ai is still learning and improving, please let us know how it did by reacting below

broad-amaranth•2mo ago

@kapa.ai are you sure maybe the logic has been embbed in refine and docs are out of data as its quite simple and uses decamelize

kapa.ai•2mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- You raise a valid point. It is possible that the logic for the humanize function has been embedded directly within Refine, and the documentation might be out of date. Given that the humanize-string library is not listed in the dependencies, Refine might be using a simpler internal implementation, possibly using decamelize or similar logic. To verify this, you can check the actual implementation in the Refine source code or reach out to the community for clarification. Here are some steps you can take: 1. Check the Source Code: You can look at the Refine source code on GitHub to see how the humanize function is implemented. This will give you the most accurate information. GitHub Repository: Refine GitHub (https://github.com/refinedev/refine) 2. Ask the Community: You can ask for clarification on the Refine Discord server or the GitHub Discussions page. The community and maintainers can provide the most up-to-date information. - Refine Discord (https://discord.gg/refine) - Refine GitHub Discussions (https://github.com/refinedev/refine/discussions) If you want to implement a simple humanize function using decamelize, here is an example:

import decamelize from 'decamelize';

const humanize = (text) => {
  return decamelize(text, ' ')
    .replace(/(^\w|\s\w)/g, m => m.toUpperCase());
};

// Example usage
const resourceName = 'posts';
const humanizedName = humanize(resourceName);

console.log(humanizedName); // Outputs: "Posts"

import decamelize from 'decamelize';

const humanize = (text) => {
  return decamelize(text, ' ')
    .replace(/(^\w|\s\w)/g, m => m.toUpperCase());
};

// Example usage
const resourceName = 'posts';
const humanizedName = humanize(resourceName);

console.log(humanizedName); // Outputs: "Posts"

You can then use this custom humanize function in your Refine configuration:

const App = () => (
  <Refine
    // ...
    options={{
      textTransformers: {
        humanize: (text) => humanize(text),
        plural: (text) => text,  // Customize as needed
        singular: (text) => text,  // Customize as needed
      },
    }}
  />
);

const App = () => (
  <Refine
    // ...
    options={{
      textTransformers: {
        humanize: (text) => humanize(text),
        plural: (text) => text,  // Customize as needed
        singular: (text) => text,  // Customize as needed
      },
    }}
  />
);

kapa.ai•2mo ago

<@422289470487003153> kapa.ai is still learning and improving, please let us know how it did by reacting below