Two groups of hierarchical selections in filter

Question

Here is the case:

when [Hierarchy] value is 'A', a group of [a] selections displays in filter area. When user switch [Hierarchy] to ‘B’, all [a] selections are replaced by [b] selections.

Solution One below might lead to an inconsistent display of selections

Solution Two puts these two groups of selections in toggle dropdown, and requires two more clicks when user wants to come back and make selection changes at any level.

Need a second person's opinion here. Which solution is better? Are there any other suggestions?
Great Thanks.

Answer 1

It seems really odd to have a hierarchy all on one line - it makes it look like the sub-items (a1, a2, b1, b2, etc) are on the same level as the category (A or B).

I would use a tree navigation, like this:

Closed state:

• A
• B

Opened out version:

• A
  • a1
    • a1a
    • a1b
    • a1c
    • a1d
  • a2
    • a2a
    • a2b
    • a2c
    • a2d
  • a3
    • a3a
    • a3b
    • a3c
    • a3d
• B
  • b1
    • b1a
    • b1b
    • b1c
    • b1d
  • b2
    • b2a
    • b2b
    • b2c
    • b2d
  • b3
    • b3a
    • b3b
    • b3c
    • b3d

items in the tree can have checkboxes or radio buttons next to them, whichever is appropriate

Answer 2

An alternative is a menu with different stages :

^{download bmml source – Wireframes created with Balsamiq Mockups}