#270 rename all JS imports to use filenames

Author: joepio

.eslintrc.js

@@ -4,6 +4,8 @@ module.exports = {
   extends: [
     'eslint:recommended',
     'plugin:prettier/recommended',
+    "plugin:import/recommended",
+    "plugin:import/typescript",
     'plugin:react/recommended', // Uses the recommended rules from @eslint-plugin-react
     'plugin:@typescript-eslint/eslint-recommended', // Uses the recommended rules from the @typescript-eslint/eslint-plugin
     'plugin:@typescript-eslint/recommended', // Uses the recommended rules from the @typescript-eslint/eslint-plugin
@@ -50,6 +52,8 @@ module.exports = {
     'comma-dangle': 'off', // https://eslint.org/docs/rules/comma-dangle
     'function-paren-newline': 'off', // https://eslint.org/docs/rules/function-paren-newline
     'global-require': 'off', // https://eslint.org/docs/rules/global-require
+    "import/extensions": ["error", "ignorePackages"],
+    "import/no-unresolved": "off",
     'import/no-dynamic-require': 'off', // https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-dynamic-require.md
     'no-inner-declarations': 'off', // https://eslint.org/docs/rules/no-inner-declarations// New rules
     'class-methods-use-this': 'off',

CONTRIBUTE.md

@@ -21,7 +21,8 @@ Talk with other devs on our [Discord][discord-url]!
 - `pnpm publish -r`
   - Choose a new version. Versions should match `atomic-data-rs`.
   - This updates the `package.json` files, creates a commit, tags it, pushes it to github, and publishes the builds to npm.
-  - If this fails, try `pnpm version patch` and `pnpm npm publish`
+  - If this fails, try `pnpm version patch` and `pnpm publish`
+  - DONT run `pnpm npm publish`, as it will not resolve workspace dependencies correctly.
 
 ## Understanding vite and pnpm workspaces
 

lib/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.34.1",
+  "version": "0.34.5",
   "author": "Joep Meindertsma",
   "dependencies": {
     "@noble/ed25519": "1.6.0",

lib/src/EventManager.test.ts

@@ -1,4 +1,4 @@
-import { EventManager } from './EventManager';
+import { EventManager } from './EventManager.js';
 enum Events {
   Click = 'click',
   LotteryWon = 'lotterywon',

lib/src/agent.test.ts

@@ -1,5 +1,5 @@
 import { expect } from 'chai';
-import { Agent } from './index';
+import { Agent } from './index.js';
 
 describe('Agent', () => {
   it('Constructs valid ', async () => {

lib/src/agent.ts

@@ -4,7 +4,7 @@ import {
   generatePublicKeyFromPrivate,
   properties,
   tryValidURL,
-} from './index';
+} from './index.js';
 
 /**
  * An Agent is a user or machine that can write data to an Atomic Server. An

lib/src/authentication.ts

@@ -1,4 +1,10 @@
-import { Agent, getTimestampNow, HeadersObject, signToBase64, Store } from '.';
+import {
+  Agent,
+  getTimestampNow,
+  HeadersObject,
+  signToBase64,
+  Store,
+} from './index.js';
 
 /** Returns a JSON-AD resource of an Authentication */
 export async function createAuthentication(subject: string, agent: Agent) {

lib/src/class.ts

@@ -7,7 +7,7 @@ import {
   Property,
   Resource,
   Store,
-} from './index';
+} from './index.js';
 
 /** Returns the Typescript interface string based on the Class */
 export async function classToTypescriptDefinition(

lib/src/client.ts

@@ -14,7 +14,7 @@ import {
   setCookieAuthentication,
   signRequest,
   Store,
-} from './index';
+} from './index.js';
 
 /** Works both in node and the browser */
 import fetch from 'cross-fetch';

lib/src/commit.test.ts

@@ -1,12 +1,12 @@
 import { expect } from 'chai';
-import { CommitBuilder } from './commit';
+import { CommitBuilder } from './commit.js';
 import {
   generatePublicKeyFromPrivate,
   parseAndApplyCommit,
   serializeDeterministically,
   signToBase64,
   Store,
-} from './index';
+} from './index.js';
 
 // These are disabled for now, as they require TextEncoder to be available
 // https://github.com/facebook/jest/issues/9983

lib/src/commit.ts

@@ -6,16 +6,17 @@ import { decode as decodeB64, encode as encodeB64 } from 'base64-arraybuffer';
 import { sha512 } from '@noble/hashes/sha512';
 utils.sha512 = msg => Promise.resolve(sha512(msg));
 
-import { properties, urls } from './urls';
-import { Store } from './store';
 import {
   isArray,
   JSONArray,
   JSONValue,
   parseJsonAdResourceValue,
   removeQueryParamsFromURL,
   Resource,
-} from './index';
+  properties,
+  urls,
+  Store,
+} from './index.js';
 
 /** A {@link Commit} without its signature, signer and timestamp */
 export interface CommitBuilderI {

lib/src/datatypes.test.ts

@@ -1,5 +1,5 @@
 import { expect } from 'chai';
-import { Datatype, urls, validateDatatype } from './index';
+import { Datatype, urls, validateDatatype } from './index.js';
 
 describe('Datatypes', () => {
   it('throws errors when datatypes dont match values', async () => {

lib/src/datatypes.ts

@@ -1,6 +1,4 @@
-import { urls } from './urls';
-import { tryValidURL } from './client';
-import { JSONValue } from './value';
+import { JSONValue, tryValidURL, urls } from './index.js';
 
 /** Each possible Atomic Datatype. See https://atomicdata.dev/collections/datatype */
 // TODO: use strings from `./urls`, requires TS fix: https://github.com/microsoft/TypeScript/issues/40793

lib/src/error.ts

@@ -1,5 +1,4 @@
-import { Resource } from './resource';
-import { properties } from './urls';
+import { Resource, properties } from './index.js';
 
 export enum ErrorType {
   Unauthorized = 'Unauthorized',

lib/src/index.ts

@@ -29,16 +29,16 @@
  * @module
  */
 
-export * from './agent';
-export * from './authentication';
-export * from './class';
-export * from './client';
-export * from './commit';
-export * from './error';
-export * from './datatypes';
-export * from './parse';
-export * from './resource';
-export * from './store';
-export * from './value';
-export * from './urls';
-export * from './truncate';
+export * from './agent.js';
+export * from './authentication.js';
+export * from './class.js';
+export * from './client.js';
+export * from './commit.js';
+export * from './error.js';
+export * from './datatypes.js';
+export * from './parse.js';
+export * from './resource.js';
+export * from './store.js';
+export * from './value.js';
+export * from './urls.js';
+export * from './truncate.js';

lib/src/parse.ts

@@ -1,8 +1,13 @@
-import { AtomicError } from './error';
-import { urls } from './urls';
-import { isArray, JSONValue, Store } from './index';
-import { Resource, unknownSubject } from './resource';
-import { JSONObject } from './value';
+import {
+  AtomicError,
+  urls,
+  isArray,
+  JSONValue,
+  JSONObject,
+  Store,
+  Resource,
+  unknownSubject,
+} from './index.js';
 
 /**
  * Parses an JSON-AD object containing a resource, adds it to the input

lib/src/resource.ts

@@ -1,4 +1,3 @@
-import { instances } from './urls';
 import {
   Agent,
   CommitBuilder,
@@ -11,8 +10,9 @@ import {
   tryValidURL,
   validateDatatype,
   valToArray,
-} from './index';
-import { JSONArray } from './value';
+  instances,
+  JSONArray,
+} from './index.js';
 
 /** Contains the PropertyURL / Value combinations */
 export type PropVals = Map<string, JSONValue>;

lib/src/store.test.ts

@@ -1,5 +1,5 @@
 import { expect } from 'chai';
-import { Resource, urls, Store } from './index';
+import { Resource, urls, Store } from './index.js';
 
 describe('Store', () => {
   it('renders the populate value', async () => {

lib/src/store.ts

@@ -1,5 +1,5 @@
-import { setCookieAuthentication } from './authentication';
-import { EventManager } from './EventManager';
+import { setCookieAuthentication } from './authentication.js';
+import { EventManager } from './EventManager.js';
 import {
   Agent,
   Datatype,
@@ -9,8 +9,8 @@ import {
   tryValidURL,
   unknownSubject,
   urls,
-} from './index';
-import { authenticate, fetchWebSocket, startWebsocket } from './websockets';
+} from './index.js';
+import { authenticate, fetchWebSocket, startWebsocket } from './websockets.js';
 
 /** Function called when a resource is updated or removed */
 type Callback = (resource: Resource) => void;

lib/src/value.ts

@@ -1,4 +1,4 @@
-import { parseJsonADResource, Resource } from './index';
+import { parseJsonADResource, Resource } from './index.js';
 
 export type JSONPrimitive = string | number | boolean;
 export type JSONValue = JSONPrimitive | JSONObject | JSONArray | undefined;

lib/src/websockets.ts

@@ -1,11 +1,11 @@
-import { createAuthentication } from './authentication';
+import { createAuthentication } from './authentication.js';
 import {
   parseAndApplyCommit,
   parseJsonADResource,
   Resource,
   Store,
   unknownSubject,
-} from './index';
+} from './index.js';
 
 /** Opens a Websocket Connection at `/ws` for the current Drive */
 export function startWebsocket(url: string, store: Store): WebSocket {

react/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.34.1",
+  "version": "0.34.8",
   "author": "Joep Meindertsma",
   "description": "Atomic Data React library",
   "dependencies": {

react/src/hooks.ts

@@ -1,4 +1,10 @@
-import { useState, useEffect, useCallback, useMemo, useRef } from 'react';
+import React, {
+  useState,
+  useEffect,
+  useCallback,
+  useMemo,
+  useRef,
+} from 'react';
 import {
   Property,
   Store,
@@ -17,8 +23,7 @@ import {
   unknownSubject,
   JSONArray,
 } from '@tomic/lib';
-import React from 'react';
-import { useDebounce } from './index';
+import { useDebounce } from './index.js';
 
 /**
  * Hook for getting a Resource in a React component. Will try to fetch the

react/src/index.ts

@@ -22,12 +22,12 @@
  * @module
  */
 
-export * from './hooks';
-export * from './useServerURL';
-export * from './useCurrentAgent';
-export * from './useDebounce';
-export * from './useImporter';
-export * from './useLocalStorage';
-export * from './useMarkdown';
-export * from './useServerSearch';
+export * from './hooks.js';
+export * from './useServerURL.js';
+export * from './useCurrentAgent.js';
+export * from './useDebounce.js';
+export * from './useImporter.js';
+export * from './useLocalStorage.js';
+export * from './useMarkdown.js';
+export * from './useServerSearch.js';
 export * from '@tomic/lib';

react/src/useCurrentAgent.ts

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useState } from 'react';
 import { Agent } from '@tomic/lib';
-import { useLocalStorage, useStore } from './index';
+import { useLocalStorage, useStore } from './index.js';
 
 const AGENT_LOCAL_STORAGE_KEY = 'agent';
 

react/src/useImporter.ts

@@ -1,5 +1,5 @@
-import { useResource } from './';
 import { useEffect, useState } from 'react';
+import { useResource } from './index.js';
 
 /** Easily send JSON-AD or a URL containing it to your server. */
 export function useImporter(importerUrl?: string) {

react/src/useMarkdown.ts

@@ -9,7 +9,7 @@ import {
   valToDate,
 } from '@tomic/lib';
 import { useEffect, useState } from 'react';
-import { useStore, useString, useTitle } from './index';
+import { useStore, useString, useTitle } from './index.js';
 
 /** Properties not relevant to show in PropValLines */
 const hiddenProps = [

react/src/useServerSearch.tsx

@@ -1,6 +1,6 @@
 import { urls } from '@tomic/lib';
 import { useEffect, useMemo, useState } from 'react';
-import { useArray, useDebounce, useResource, useStore } from './index';
+import { useArray, useDebounce, useResource, useStore } from './index.js';
 
 interface SearchResults {
   /** Subject URLs for resources that match the query */

react/src/useServerURL.ts

@@ -1,6 +1,6 @@
 import { isValidURL } from '@tomic/lib';
 import { useCallback } from 'react';
-import { useLocalStorage, useStore } from './index';
+import { useLocalStorage, useStore } from './index.js';
 
 /**
  * A hook for using and adjusting the Server URL. Also saves to localStorage. If

tsconfig.build.json

@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     "target": "ES5",
-    "module": "commonjs",
+    "module": "ES2022",
     "lib": [
       "ES6",
       "ES7",