run linter

.eslintrc

@@ -1,41 +1,34 @@
 {
-	"parser": "@typescript-eslint/parser",
-	"plugins": [
-		"@typescript-eslint",
-		"react-hooks",
-		"simple-import-sort"
-	],
-	"extends": [
-		"eslint:recommended",
-		"plugin:react/recommended",
-		"plugin:react-hooks/recommended",
-		"plugin:@typescript-eslint/recommended",
-		"prettier"
-	],
-	"parserOptions": {
-		"ecmaVersion": 2020,
-		"sourceType": "module",
-		"ecmaFeatures": {
-			"jsx": true
-		}
-	},
-	"rules": {},
-	"overrides": [
-		{
-			"files": [
-				"*.test.ts",
-				"*.test.tsx"
-			],
-			"rules": {
-				// Allow testing runtime errors to suppress TS errors
-				"@typescript-eslint/ban-ts-comment": "off"
-			}
-		}
-	],
-	"settings": {
-		"react": {
-			"pragma": "React",
-			"version": "detect"
-		}
-	}
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["@typescript-eslint", "react-hooks", "simple-import-sort"],
+  "extends": [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier"
+  ],
+  "parserOptions": {
+    "ecmaVersion": 2020,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "rules": {},
+  "overrides": [
+    {
+      "files": ["*.test.ts", "*.test.tsx"],
+      "rules": {
+        // Allow testing runtime errors to suppress TS errors
+        "@typescript-eslint/ban-ts-comment": "off"
+      }
+    }
+  ],
+  "settings": {
+    "react": {
+      "pragma": "React",
+      "version": "detect"
+    }
+  }
 }

.prettierrc.cjs

@@ -2,12 +2,12 @@
  * {@type require('prettier').Config}
  */
 module.exports = {
-	useTabs: false,
-	printWidth: 100,
-	singleQuote: true,
-	trailingComma: 'none',
-	bracketSameLine: false,
-	semi: true,
-	tabWidth: 2,
-	quoteProps: 'consistent'
+  useTabs: false,
+  printWidth: 100,
+  singleQuote: true,
+  trailingComma: 'none',
+  bracketSameLine: false,
+  semi: true,
+  tabWidth: 2,
+  quoteProps: 'consistent'
 };

CHANGELOG.md

@@ -3,27 +3,34 @@
 2023-12-27
 
 ### Breaking changes
+
 None
 
 ### Additional changes
-* Fix buggy behavior where the reference to `useChannel` functions would be changing on every render. This would cause your useEffects to run even if there should be no change.
+
+- Fix buggy behavior where the reference to `useChannel` functions would be changing on every render. This would cause your useEffects to run even if there should be no change.
 
 # 0.0.1-alpha.6
 
 2023-12-23
 
 ### Breaking changes
+
 None
 
 ### Additional changes
-* Fixed a bug where if you successfully connected to a channel, but then later on the topic supplied to `useChannel` had changed to `null` and then back to the valid topic, the `useChannel` hook functions like `push` would no longer be holding a valid reference to the channel. Now, the hook will successfully update the reference and the functions will work as if the channel topic never changed.
-* Use the internel channel `ref` when using `useChannel`'s `leave`
+
+- Fixed a bug where if you successfully connected to a channel, but then later on the topic supplied to `useChannel` had changed to `null` and then back to the valid topic, the `useChannel` hook functions like `push` would no longer be holding a valid reference to the channel. Now, the hook will successfully update the reference and the functions will work as if the channel topic never changed.
+- Use the internel channel `ref` when using `useChannel`'s `leave`
+
 # 0.0.1-alpha.5
 
 2023-12-17
 
 ### Breaking changes
-* The typescript type for `useChannel`'s `PushEvent` now aligns with the rest of the types
+
+- The typescript type for `useChannel`'s `PushEvent` now aligns with the rest of the types
+
 ```jsx
 type PushEvent = {
 	- type: string;
@@ -35,12 +42,14 @@ type PushEvent = {
 ```
 
 ### Additional changes
-* Added rollup build tooling which should reduce bundle size slightly
-* Phoenix.js is now marked as a peer dependency
-* `useChannel` can now accept a short circuit operation to delay connecting to the channel until the condition is met.
-
-	```jsx
-	// Delay connecting until id is defined
-	const [channel] = useChannel(id && `room:${id}`)
-	```
-* The `push` function type has been improved to catch more potential errors.
+
+- Added rollup build tooling which should reduce bundle size slightly
+- Phoenix.js is now marked as a peer dependency
+- `useChannel` can now accept a short circuit operation to delay connecting to the channel until the condition is met.
+
+  ```jsx
+  // Delay connecting until id is defined
+  const [channel] = useChannel(id && `room:${id}`);
+  ```
+
+- The `push` function type has been improved to catch more potential errors.

README.md

@@ -9,22 +9,22 @@ Wrap the intended part of your application with a `PhoenixProvider`.
 import { PhoenixProvider } from 'use-phoenix';
 
 const Application = () => {
-	return <PhoenixProvider>...</PhoenixProvider>;
+  return <PhoenixProvider>...</PhoenixProvider>;
 };
 ```
 
 Passing a `url` and params to your `PhoenixProvder` will connect to your socket instantly **on mount**:
 
 ```tsx
 return (
-	<PhoenixProvider
-		url="ws://localhost:4000/socket"
-		options={{
-			params: { token: 'xyz' }
-		}}
-	>
-		...
-	</PhoenixProvider>
+  <PhoenixProvider
+    url="ws://localhost:4000/socket"
+    options={{
+      params: { token: 'xyz' }
+    }}
+  >
+    ...
+  </PhoenixProvider>
 );
 ```
 
@@ -44,13 +44,13 @@ Later on when you would like to connect the socket:
 import { usePhoenix } from 'use-phoenix';
 
 const Component = () => {
-	const { socket, connect } = usePhoenix();
+  const { socket, connect } = usePhoenix();
 
-	useEffect(() => {
-		connect('ws://localhost:4000/socket', {
-			params: { token: 'xyz' }
-		});
-	}, [connect]);
+  useEffect(() => {
+    connect('ws://localhost:4000/socket', {
+      params: { token: 'xyz' }
+    });
+  }, [connect]);
 };
 ```
 
@@ -135,7 +135,7 @@ Optionally, if you would rather capture the response in a callback you can (or b
 
 ```ts
 const { data } = useEvent<JoinEvent>(channel, 'join', (data) => {
-	console.log(response);
+  console.log(response);
 });
 ```
 
@@ -215,8 +215,8 @@ users[0].metas.lastSeen;
   const [channel, { leave }] = useChannel('chat:lobby');
 
   useEffect(() => {
-  	return () => {
-  		leave();
-  	};
+    return () => {
+      leave();
+    };
   }, [leave]);
   ```

rollup.config.js

@@ -10,36 +10,36 @@ import pkg from './package.json' assert { type: 'json' };
 const isDev = process.env.BUILD !== 'production';
 
 const cjs = {
-	file: pkg.main,
-	format: 'cjs',
-	exports: 'named',
-	sourcemap: true,
-	plugins: !isDev && [terser()]
+  file: pkg.main,
+  format: 'cjs',
+  exports: 'named',
+  sourcemap: true,
+  plugins: !isDev && [terser()]
 };
 
 const esm = {
-	file: pkg.module,
-	format: 'esm',
-	exports: 'named',
-	sourcemap: true
+  file: pkg.module,
+  format: 'esm',
+  exports: 'named',
+  sourcemap: true
 };
 
 const extensions = ['.js', '.ts', '.tsx', '.json'];
 
 const plugins = [
   typescript(),
-	resolve({ extensions }),
-	commonjs(),
-	babel({ exclude: 'node_modules/**', extensions }),
-	replace({
-		'preventAssignment': true,
-		'process.env.NODE_ENV': JSON.stringify(isDev ? 'development' : 'production')
-	})
+  resolve({ extensions }),
+  commonjs(),
+  babel({ exclude: 'node_modules/**', extensions }),
+  replace({
+    'preventAssignment': true,
+    'process.env.NODE_ENV': JSON.stringify(isDev ? 'development' : 'production')
+  })
 ].filter(Boolean);
 
 export default {
-	input: 'src/index.ts',
-	output: isDev ? [esm] : [cjs, esm],
-	plugins,
-	external: Object.keys(pkg.peerDependencies)
+  input: 'src/index.ts',
+  output: isDev ? [esm] : [cjs, esm],
+  plugins,
+  external: Object.keys(pkg.peerDependencies)
 };