How to create subcollection with uid as collection name Firestore V9 (TS/React Native)

I have a collection at the root of my database, userCategories.

In my app, the user can add “categories”, the name of the category will be unique, and each category document looks like this:

{
  createdAt:Timestamp.now(),
  categoryName: userDefinedCategoryName,
  color:randomColorCode
}

I want the structure of this to be as follows:

root-
  |-userCollection
      |-uid1
      |-uid2
  |-userCategories
      |-uid1
          |-{createdAt:...,categoryName:"...",color:"..."}
           -{createdAt:...,categoryName:"...",color:"..."}
      |-uid2
          |-{createdAt:...,categoryName:"...",color:"..."}

I am currently using:

const categoryDocRef = doc(db, "userCategories", uid);
await setDoc(
  categoryDocRef, {
    createdAt:Timestamp.now(),
    categoryName:category,
    color:color
  }).then(() => {
    return {
      success: true,
      errorMessage:""
    };
  });

But this only allows me to create a single document within each uid, instead of multiple, as uid1 would have.

I am aware that I could do something like this:

const categoryDocRef = doc(db, "userCategories",uid);
const colRef = collection(categoryDocRef, "Anything Here")
await addDoc(
  colRef, {
    createdAt:Timestamp.now(),
    categoryName:category
    color:color
  }).then(() => {
    console.log(`User document for uid:${uid}`);
    return {
      success: true,
      errorMessage:""
    };
  });

But this creates a structure like this:

|-userCategories
    |-uid1
        |-anything here
            |-firebase generated id
                |-{createdAt:...,categoryName:"...",color:"..."}
                 -{createdAt:...,categoryName:"...",color:"..."}

I feel that the either the firebase generated id or the anything here part is unnecessary as I could use either categoryName or firebase generated id and it would avoid another layer of nesting.

Is there any way to achieve this?