كيفية إستدعاء دوال من داخل مكون React آخر؟

مرحباً بك: 
تحتاج ال stateManagement فقط في حالة كانت ال state مشتركة في مكونات كثيرة ولكن هنا هي فقط state ما بين الثلاث مكونات كالآتي: 
 

function App() {
  state= {
	isFilterChanged: false
  };
  // عند تغيير الفلاتر تقوم بتحديث ما تريد في ال state
  updateFilterState = () => {
  // تقوم بتحديث كمثال isFilterChanged
    this.setState({ isFilterChanged: true });
  }
  
  render() {
  	const { isFilterChanged } = this.state; // تمرير الخاصية للمكونات الأخرى
    
  	return(
      <>
    	<TopBar isFilterChanged={isFilterChanged} />
      	/* عند تغيير الفلاتر نقوم بتحديث ال state 
        وتمريرها للمكونات الأخرى
        */
      	<Filters onChangeFilter={updateFilterState} /> 
      </>
    );
  }
}

وعندما تريد الإستفادة من التغيير الحاصل يجب أن تستقبل isFilterChanged بداخل المكونات الأخرى ومقارنة قيمتها الحالية بقيمتها السابقة فإذا كانت مختلفة تقوم بتنفيذ كود معين 

function TopBar() {
  componentDidUpdate(prevProps) {
  	const { isFilterChanged } = this.props;
    // التحقق ما إذا كانت القيمة تغيرت أم لا 
    if(prevProps.isFilterChanged !== isFilterChanged) {
    	// نقوم بتنفيذ دالة هنا أو أي شيئ تريده لأن القيمة اتغيرت
      console.log('isFilterChanged', isFilterChanged)
    }
  }
  
  render() {
    
  	return(
      <>
			<nav>Header</nav>
      </>
    );
  }
}

أنصح في هذه الحالة استعمال هيكلة مرفوقة ب state managment وأقترح استخدام ال context api لأنه بسيط ويتفق مع حجم التطبيق الحالي الخاص بك يمكنك الاطلاع على تعليقي هنا ﻷخذ فكرة 

https://academy.hsoub.com/questions/14018-تغير-مكون-بناءًا-على-حالة-مكون-react-آخر؟/#comment-39584