feat: autocomplete

[DoneDeal0]

Start autocomplete feature and refactor code. The autocomplete currently displays all the available paths. It should only display direct child nodes (user => user.describe => user.describe.complex / user.describe.simple instead of immediately displaying final paths: user.describe.complex, user.describe.simple).

The pr also needs to fix the Property 'split' does not exist on type 'never' issue on currentKey.split in T function.

Any help welcome.

[ablankenship10]

Fixed Property 'split' does not exist on type 'never' in PR #12

[DoneDeal0]

Hi @ablankenship10 , thanks for your pr, it fixes the ts issue! However, let's please send all of our commits to the same PR in order to keeps things organized ;).

The latest commit:

• Adds your TS fix
• Introduces a useT() hook that return the classic T function. By wrapping T in useT, it allows us to consume Talkr's context and access the current language object, which is necessary to type the key parameter in T and thus provide an autocomplete.

Remaining issues:

• The autocomplete doesn't work yet. The typing is good, because if we use the same typings in a random function we get a proper autocomplete:

// en.json
{
  "hello": "hello",
  "talkr": {
    "test": "talkr works"
  },
  "company": {
      "employee": {
          "tech": "tech team",
          "sales": "sales team"
      }
  },
}

// .tsx file:
type KeyPrefix<T extends string> = T extends "" ? "" : `.${T}`;

export type KeyPath<T> = (
  T extends object
    ? {
        [K in Exclude<keyof T, symbol>]: `${K}${KeyPrefix<KeyPath<T[K]>>}`;
      }[Exclude<keyof T, symbol>]
    : ""
) extends infer D
  ? Extract<D, string>
  : never;

type Path = KeyPath<typeof en>

  function getString(path: Path) {
    let result: any = obj
    path.split(".").forEach((k) => {
        if (!result[k]) return;
        return (result = result[k]);
    });
    return typeof result === "string" ? result : null
  }
  

export default function App() {
  return (
    <>
      <h1>{getString("company.employee.sales")}</h1>
    </>
  );
}

useT returns a correct schemaLanguage (checked with console.log). So T's parameter key should be correctly typed. Yet, when using it, I receive the error: Argument of type '"hello"' is not assignable to parameter of type '""'.

When hardcoding the object const schemaLanguage = {hello: "hello", etc.}, the autocomplete works! So we're not far from success... But I don't see why it doesn't work yet.

[ablankenship10]

 export type KeyPath<T> = (
   T extends object
     ? {
         [K in Exclude<keyof T, symbol>]: `${K}${KeyPrefix<KeyPath<T[K]>>}`;
       }[Exclude<keyof T, symbol>]
     : ""
 ) extends infer D
   ? Extract<D, string>
   : never;
 
 

I receive the error: Argument of type '"hello"' is not assignable to parameter of type '""'.

: "" should be : string, as "" means literally blank string and no other value. Thats what I had changed in my PR to fix the currentKey value.

[DoneDeal0]

Closes #10 The autocomplete now works with hard-coded strings, concatenation or variables. In order to avoid breaking changes and performance issues for huge json files, the autocompletion is optional, and must be configured in a small translate.ts file. I will publish the package on npm soon.