v0.11.0

[LunatiqueCoder]

Introduction

When developing anything, there are usually 3 parts of the process:

1. Make it work
2. Make it right
3. Make it fast

• This PR is a Proof of concept of #165 where we're almost finalising step 1.

The code is a total mess, lots of TypeScript errors, bad constant namings, experiments, etc. But it's something that's working!

▶️ Video: https://x.com/LunatiqueCoder/status/1721982083902394694?s=20

How to test

1. Git clone this branch.
2. Change the following in the package.json:

If you use TypeScript, this might be the easiest way to workaround the type errors errors. Otherwise, you might need to setup a typescript watcher instead for this step.

3. Run yarn link
4. If you don't have an existing drax project, you can git clone LunatiqueCoder/expo-drax-example
5. Your metro.config.js should look like this:

// Learn more https://docs.expo.io/guides/customizing-metro
const { getDefaultConfig } = require('expo/metro-config');
const path = require('path');

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname);

if (__DEV__) {
  config.resolver.disableHierarchicalLookup = true;
  // 2. Let Metro know where to resolve packages and in what order
  config.resolver.nodeModulesPaths = [
    // Other packages, like redux-toolkit, might require the following as well
    path.resolve(__dirname, 'node_modules/@reduxjs/toolkit/node_modules'),

    // Because we're disabling hierarchical lookup, we have to tell what node_modules to use
    path.resolve(__dirname, 'node_modules'),
  ];

  config.resolver.enableGlobalPackages = true;
  config.watchFolders = ['/Users/myuser/OpenSource/react-native-drax'];
}

module.exports = config;

5. Be sure to adapt the code above with your paths!
6. Run yarn link react-native-drax
7. Run yarn add react-native-drax@link:path-to-cloned-react-native-drax

I think npm users might have to use npm install react-native-drax@file:path-to-cloned-react-native-drax, but I'm not sure.

9. Run the app

[LunatiqueCoder]

Ok, so I tested this on the expo-drax-example and also on our project both mobile+web. It works pretty well. Now it's time to cleanup the code and improve it as much as possible.

Also, Drax should benefit from the new Architecture features by using for example useLayoutEffect instead of onLayout, etc, etc.

@lafiosca When it gets in a better shape, can you help me release a beta version? I'd love to get the feedback from the community as well.

[LunatiqueCoder]

❤️❤️ I just love this

https://github.com/user-attachments/assets/0fd23c1e-e1da-4e30-bdac-fcb77ced0b08

[lafiosca]

Awesome work, I can try to help when ready!

[agonselimi]

Awesome work @LunatiqueCoder 🙌 . When is this expected to be ready?